не удается сохранить данные в хранилище с помощью контекстных крючков

#reactjs #react-hooks

Вопрос:

Я пытаюсь сохранить выбранные элементы в массиве и сохранить. Я мог бы идеально хранить выбранные элементы в массиве, но при их хранении в хранилище возникает задержка. например, я выбрал три элемента, если при вводе массива консоли я получаю 3 элемента, но в консоли магазина отображаются два элемента.

Это мой код

 const checkSelection = useCallback(
        (developer, e) => {
            if (e.target.checked) {
                setCheckedItems([...checkedItems, developer]);
            } else {
                setCheckedItems((prevState) => prevState.filter((item) => item !== developer));
            }

// these is my store data
            saveSelectedDeveloper({
                selectedItems: checkedItems,
            });
        },
        [saveSelectedDeveloper, checkedItems],
    );
 

Я довольно новичок в этой концепции контекста, может ли кто-нибудь сказать мне, где ошибка в приведенном выше коде.

Ответ №1:

это происходит потому, что проверенные элементы не обновлялись сразу, это обновление только при следующем рендеринге, поэтому вы должны установить то же значение, которое вы установили в ur setCheckedItems

 if (e.target.checked) {
                setCheckedItems([...checkedItems, developer]);
                saveSelectedDeveloper({
                  selectedItems: [...checkedItems, developer],
                });
            } else {
                setCheckedItems((prevState) => {
                  saveSelectedDeveloper({
                    selectedItems: prevState.filter((item) => item !== developer),
                  });  
                  return prevState.filter((item) => item !== developer)
                });
            }