如何在点击事件中使用一个复选框发送两个参数?

时间:2019-06-11 08:43:41

标签: reactjs this setstate

我想做的是,当用户单击复选框时,应将相应的companyid传递给该函数,在该函数中我可以更新其激活状态。但是我无法通过一种方法发送2个值。

我在各种网站上进行搜索,但仍然无法获得任何结果。

这就是我印刷公司的方式:

{this.state.allCompanies.map(com => (
                <tr>
                 <td>{com.cname} </td>
                  <td>
                    <a>
                        <input
                          type="checkbox"
                          name="active"
                          checked={com.is_active == 1 ? "true" : ""}
                          onClick={this.handleActivated(this, com.cid)}
                        />
                    </a>
                  </td>
                </tr>

这是我的handleActivated函数:

handleActivated(e, id) {
    const active = e.target.name;
    console.log(e.target.value);
    console.log(e.target.checked);

    this.setState({
      active: e.target.checked
    });

    // this.setState({  });
  }

这是我的状态。

this.state = {
      allCompanies: [],
      data: false,
      company: "",
      active: ""
    };
    this.handleActivated = this.handleActivated.bind(this);

我想要的是companyid方法中的handleActivated

2 个答案:

答案 0 :(得分:2)

希望它能对您有所帮助。

onClick={(e) => this.handleActivated(e, com.cid)}

答案 1 :(得分:0)

将点击更改为此

onClick={event=>this.handleActivated(event,com.cid)}

将功能更改为箭头功能

handleActivated =(e, id)=> {
    const active = e.target.name;
    console.log(e.target.value);
    console.log(e.target.checked);

    this.setState({
      active: e.target.checked
    });

    // this.setState({  });
  }

一旦这样做,就可以将其从构造函数中删除,因为不再需要它。

this.handleActivated = this.handleActivated.bind(this);

这将为您提供更简洁的代码