How to solve the problem with keys in the map method?

Question

React

if (data.result !== '') {
      setPopout(<ScreenSpinner size='large' />);
      data.result.map((e, index) => {
        ToDoList.push({id: e.id, name: e.name, key: {index}});
      });

      setPopout(null);
    }

i pass a unique key, but the error remains Warning: Encountered two children with the same key, `2`. Keys should be unique so that components maintain their identity across updates. Non-unique keys may cause children to be duplicated and/or omitted - the behavior is unsupported and could change in a future version.

Answer 1

You can have many key components on your page. If you always only use the index for this - repetitions are inevitable. To avoid this, make the key a unique string. For example `todo-item-{index}` or you have an id for each element - use it for the key

Answer 2

The mechanics of your piece of code is not entirely clear, but use this guide