使用React的方法来获取复选框中已选中的值
P粉590929392
P粉590929392 2023-09-02 22:36:49
[React讨论组]

我正在尝试检索复选框的选中值并将其保存到数组中。 我尝试了:

arr.push(setNewItem(checked))
arr.push(e.target.value.checked)
arr.push(items.checked)

但这些返回类型错误或未定义的值。

const [checkedItems, setCheckedItems] = useState([]);
const handleChange = (e) => {
    if (e.target.checked) {
      var arr = [...checkedItems];
      //arr.push(setNewItem(e.target.value.checked));
      setCheckedItems(arr);
      console.log(arr);
    } else {
      checkedItems = "";
    }
    setIsChecked((current) => !current);
  };
return (
    <div className="App">
      <StyleForm>
        <StyleInput
          type="text"
          placeholder="添加"
          value={newItem}
          onChange={(e) => setNewItem(e.target.value)}
          onKeyPress={handleOnKeyPress}
        />
        <ButtonAddStyle onClick={() => addItem()}>添加</ButtonAddStyle>

        <StyleUl>
          {items.map((item) => {
            return (
              <StyleLi key={item.id}>
                <StyleCheckBox
                  type="checkbox"
                  value={isChecked}
                  onChange={handleChange}
                />
                {item.value}
                {""}
                <ButtonDelStyle onClick={() => deleteItem(item.id)}>
                  X
                </ButtonDelStyle>
              </StyleLi>
            );
          })}
        </StyleUl>
      </StyleForm>
    </div>
  );
P粉590929392
P粉590929392

全部回复(1)
P粉575055974

这可能解决您的问题。

const [checkedItems, setCheckedItems] = useState([]);
const handleChange = (e) => {
  setCheckedItems( prev => [...prev, e.target.checked]);
  setIsChecked((current) => !current);
};
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号