How to force react to re-render a component?

Question

React

It seems like a simple question, but I don’t know how to do it better.
There is a component, everything is fine in it, everything is updated except for one variable, but it is also the most important.

function CreateList({ filterList, caseMassive }) {

  // в caseMassive приходит массив типа[
  {  label: "first", important: true, id: 1,},
  { label: "second", important: false,id: 2,},
  { label: "third", important: true,id: 3,},
];

  let newMassive = caseMassive;

  // потом я этот масcив переделываю в список лишек "</li>"*

  let finishList = newMassive.map((element) => {
    return <ListItem key={element.id} element={element} />;
  });

  //  И ВООТ на этом этапе и проблема. Сам CreateList замечательно обновляется,
  // но переменная finishList  не перерендывается при изменениях.
  //  как сделать так чтобы переменная finishList также обновлялась при обновлении CreateList ?,

  return <ol>{finishList}</ol>;
}

The project itself is stored here, the repository
is ready to see the build

Answer 1

Use state to store an array and then it will be updated.

Answer 2

use immutable data structures. in order for the component to start the rerender process, the reference to the object (caseMassive) must change
https://stackoverflow.com/questions/36084515/how-d...