Блог

Главная - Вопросы по программированию - Крючки реакции добавляют сопоставленные значения флажков в массив или удаляют его

Крючки реакции добавляют сопоставленные значения флажков в массив или удаляют его

#javascript #arrays #reactjs #react-hooks

Вопрос:

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

Мой jsx ;

 {props.edit amp;amp; <input type="checkbox" value={props.id} onChange={(e) => setDeleteId(e)}/>}

Функции ;

   const [deleteId, setdeleteId] = useState([]);

  const setDeleteId = (e) => {
    setdeleteId([...deleteId, e.target.value]);
  }

  useEffect(() => {
    console.log(deleteId);
  }, [deleteId])

Комментарии:

1. Вы говорите «флажки», но тогда в вашем коде есть только один флажок. Можете ли вы опубликовать кодовое поле, которое демонстрирует проблему?

2. Его на карте массива. Таким образом, существует несколько флажков. Извините за неполный код.

3. Можете ли вы опубликовать какой-нибудь полный код?

Ответ №1:

Ваш обработчик событий выглядит так, как будто он всегда просто добавляет флажок id в состояние — вам также нужно удалить его, когда флажок снят, например —

 const [selected, setSelected] = useState([]);

const handleChange = event => {
    const { checked, value } = event.currentTarget;

    setSelected(
      prev => checked
        ? [...prev, value]
        : prev.filter(val => val !== value)
    );
};

Вот демонстрационная версия на StackBlitz, показывающая, как все это сочетается.

Метки: