Using For in combination with createStore array of arrays property
Hello all. I've run into an issue with regards to using a store which contains a property that's an array of string arrays. The issue is that it rerenders all the JSX that's in the For callback for that index. It kinda looks like the following:
const [store, setStore] = createStore({ synonyms: [['test_1', 'test_2'], ['test_3', 'test_4']], ...other_properties });
const onChange = (value: any, index: number) => {
setStore('synonyms', index, value);
}
<For each={store.synonyms}>
{(item, index) => (
// Everything in here gets rerendered everytime onChange is triggered.
<>
<OtherComponent />
<Select name={
<OtherComponent />
</>
)}
</For>
I hope someone knows what I can do to solve this issue.
const [store, setStore] = createStore({ synonyms: [['test_1', 'test_2'], ['test_3', 'test_4']], ...other_properties });
const onChange = (value: any, index: number) => {
setStore('synonyms', index, value);
}
<For each={store.synonyms}>
{(item, index) => (
// Everything in here gets rerendered everytime onChange is triggered.
<>
<OtherComponent />
<Select name={
synonyms.${index()}} options={options} multiple onChange={(value) => onChange(value, index())} /><OtherComponent />
</>
)}
</For>
I hope someone knows what I can do to solve this issue.
