Question

我在reactjs中映射json数据，我想在map函数中设置State，但是在控制台“非法构造函数”中给出了错误。

  {
                  links.get("links").map((data, index) => {

                    if (data.get("type") == "DROPDOWN") {
                      return (


                        <div className="circle" style={{ position: "relative" }} onClick={() => {

                         _this.setState({
                          openDrawer: !_this.state.openDrawer
                         })
                        }}>
                          <div className="aligner">
                            <span className="fa fa-plane"></span>
                            <span style={{ position: "absolute", top: "48px" }} >{data.get("name")}</span>
                          </div>
                        </div>

                      )
                    }

Answer 1

您需要像这样绑定上下文：

 {
              links.get("links").map((data, index) => {

                if (data.get("type") == "DROPDOWN") {
                  return (


                    <div className="circle" style={{ position: "relative" }} onClick={() => {

                     _this.setState({
                      openDrawer: !_this.state.openDrawer
                     })
                    }}>
                      <div className="aligner">
                        <span className="fa fa-plane"></span>
                        <span style={{ position: "absolute", top: "48px" }} >{data.get("name")}</span>
                      </div>
                    </div>

                  )
                }.bind(this)

希望这会有所帮助。

Answer 2

我建议您有一个单独的处理程序来设置这样的状态

setOpenDrawerHandler = () => {
 this.setState((prevState,currentPrrops)=>{ return {openDrawer: !prevState.openDrawer} })
}

，然后在地图

中使用此引用

<div className="circle" style={{ position: "relative" }} onClick={this.setOpenDrawerHandler }>

ReactJS在map函数内部设置状态

2 个答案: