S
SolidJS2mo ago
Zwel

Adding new element to an array before the last element inside solid store

const [tabStore, setTabStore] = createStore<{ contents: TabContent[] }>({
contents: [
{
id: 'original',
button: (
<>
Original <Icon namespace="Globe" {...iconProps} />
</>
)
},
{
id: 'new',
button: (
<>
<Icon namespace="Add" {...iconProps} /> New Effect
</>
)
}
]
})


const addNewTab = (newTab: TabContent) => {
setTabStore('contents', tabs => [
...tabs.slice(0, tabs.length - 1),
newTab,
tabs[tabs.length - 1]
])
}
const [tabStore, setTabStore] = createStore<{ contents: TabContent[] }>({
contents: [
{
id: 'original',
button: (
<>
Original <Icon namespace="Globe" {...iconProps} />
</>
)
},
{
id: 'new',
button: (
<>
<Icon namespace="Add" {...iconProps} /> New Effect
</>
)
}
]
})


const addNewTab = (newTab: TabContent) => {
setTabStore('contents', tabs => [
...tabs.slice(0, tabs.length - 1),
newTab,
tabs[tabs.length - 1]
])
}
Is there other way to update like this. I am thinking of if I can add new element using index like splice(index, 1, newElement) inside solidStore. I am also trying "path update", but it doesn't match my scenario. Thanks for your help!
1 Reply
bigmistqke 🌈
bigmistqke 🌈2mo ago
U can use produce, see https://docs.solidjs.com/reference/store-utilities/produce#produce Its callback returns a proxy on which you can do mutations, and under the hood it will transform those mutations into immutable operations.