javascript - onClick，如何知道复选框在多个复选框中被选中或未选中？

Question

我发现了许多与复选框相关的问题，但不像我的那样相关。请检查并帮助。

我有 10 多个复选框，它们根据 API 数据（循环列表）动态创建。

在这里，我想知道 onClick 复选框是未选中还是选中（因此我将调用不同的 API）。

要知道/标记选中或未选中，我尝试使用状态。但问题是，当我选中/取消选中所有复选框时，所有复选框都具有相同的影响。

请帮我单独处理。

我的代码如下：

 this.state = {
        isChecked: true,
    };

 handleClick = (e) => {
    console.log("clicked", e.fieldId);
    this.setState((prevState) => ({
      isChecked: !prevState.isChecked,
    }));

 if(this.state.isChecked){
       // update to API 1
  }else{
     // update to API 2
  }
  };

 <input
         type="checkbox"
         checked={this.state.isChecked}
         onClick={() => this.handleClick(subitems)}
         name="check"
 />
 <label className="form-check-label cost-blue">
 {subitems.message}
 </label>

注意：已经根据 API 列表数据检查了一些复选框。但是通过使用状态，我也无法处理

编辑：这就是我从 API 循环的方式

Object.keys(dataMap).map((value, key) => {
                return (
                  <div className="mt-10">
                    <div className="row text-center m-0 p-box white">
                      <div>
                        <img src={plant_icon} alt="plant" />
                        <span className="mb-0">&nbsp;&nbsp; {value}</span>
                      </div>
                    </div>
                    {dataMap[value].map((subitems) => {
                      return (
                        <div className="form-check custom-cb m-10">
                          <input
                            className="form-check-input mt-7"
                            type="checkbox"
                            checked={this.state.isChecked}
                            onClick={() => this.handleClick(subitems)}
                            name="check"
                          />
                          <label className="form-check-label cost-blue">
                            {subitems.message}
                          </label>
                        </div>
                      );
                    })}
                  </div>
                );
              })

标签： javascripthtmlreactjs