react钩子将Map的复选框值添加到数组或将其删除

t3irkdon 于 2021-09-13 发布在 Java

关注(0)|答案(1)|浏览(303)

我在网上尝试了一些解决方案，但无法修复，因此我需要询问。我有在渲染中Map的复选框。如果选中，我想将复选框的值添加到数组状态，如果未选中，则删除该值。感谢你对我所做的一切的帮助；
我的jsx；

{props.edit && <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])

Arrays JavaScript reactjs react-hooks

来源：https://stackoverflow.com/questions/68308685/react-hooks-add-mapped-checkbox-values-to-array-or-remove-it

1条答案

按热度按时间

nom7f22z1#

您的事件处理程序看起来总是在添加复选框 id 到状态-当复选框未选中时，您还需要将其删除，例如-

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

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

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

下面是stackblitz的一个演示，展示了它是如何组合在一起的。

赞(0）回复(0）举报 2021-09-13

我来回答

react钩子将Map的复选框值添加到数组或将其删除

1条答案

相关问题

热门标签

最新问答