Open VladislavPopovSR opened 1 year ago
I'm using s-tabs-panel for switch between new requests and history tabs (depending on value of current tab i pass different props through component)
const NEW_REQUESTS_TAB = 'newRequests'; const HISTORY_TAB = 'history';
<KeyRecoveryNewRequestsList :page="currentTab === HISTORY_TAB?'history':'' "/>
Inside KeyRecoveryNewRequestsList (it's the first column) :
<s-table-column. v-if="!props.page" type="selection" :selectable="hasActions" />
Expected behavior : New requests page should have selection table and history page shouldn't.
To display every switch between tabs I added onUpdate hook :
const props=defineProps<{ page:string }>() onUpdated(()=>console.log("props:"+props.page))
Real behavior : Every time i switch between tabs selection column adds as last.
I've attached the video below. Thanks!
https://github.com/soramitsu/soramitsu-js-ui-library/assets/149061523/13983e33-1f82-4688-935e-e958897f944f
UPD
As I understand every new selection column appears since we don't rerender full component, we just pass through our component different prop value so only selection column rerenders. The next code works properly :
<KeyRecoveryNewRequestsList v-if="currentTab === HISTORY_TAB" page='history'/> <KeyRecoveryNewRequestsList v-else/>
I guess thats not design system problem, it's depending on design system components usage.
I'm using s-tabs-panel for switch between new requests and history tabs (depending on value of current tab i pass different props through component)
Inside KeyRecoveryNewRequestsList (it's the first column) :
Expected behavior : New requests page should have selection table and history page shouldn't.
To display every switch between tabs I added onUpdate hook :
Real behavior : Every time i switch between tabs selection column adds as last.
I've attached the video below. Thanks!
https://github.com/soramitsu/soramitsu-js-ui-library/assets/149061523/13983e33-1f82-4688-935e-e958897f944f
UPD
As I understand every new selection column appears since we don't rerender full component, we just pass through our component different prop value so only selection column rerenders. The next code works properly :
I guess thats not design system problem, it's depending on design system components usage.