Answer the question
In order to leave comments, you need to log in
One element changes in the list, all the rest are rendered (Immutable + memoize) ReactJS, what am I doing wrong?
One element in the list changes, all the rest are rendered (Immutable + memoize)
Fully finished example https://stackblitz.com/edit/react-lyx4ka?file=redu...
There is an array (OrderedMap from ImmutableJS) that contains an object with such data { id: 1, isActive: false, text: 'item-1' }. We store the list in store(redux) By clicking on the element, we change the value of the isActive field from false => true. I pass the immutable OrderedMap structure to the List component, then I store the object using the lodash/memoize function:
function normalizeList(list) { return list.valueSeq().toArray(); } const memoizeList = memoize(normalizeList); const handleSelectedItem = (id) => updateData(id);
List items are Item(components)
All elements are re-rendered after clicking on one of them, although if all fields are unchanged, this is not a new object (link to it).
Answer the question
In order to leave comments, you need to log in
return <Item
onClick={handleSelectedItem.bind(List, item.id)}
key={item.key}
isActive={item.isActive}
text={item.text}
/>
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question