React onClick函数参数变为"Proxy"对象

roh*_*anp 8 javascript reactjs

我在我的反应层次结构的顶层有一个元素数组,我想用一个带有元素值(一个字符串)的参数来设置onClick函数.但是,当我尝试打印此值时,将打印"代理"对象:Proxy {dispatchConfig: null, _targetInst: null, isDefaultPrevented: null, isPropagationStopped: null, _dispatchListeners: null…}

这是我的渲染函数中的代码:

return collapseChoices.map((choice) => {
        console.log(choice)

        return (
          <div className="collapseChoice"
             onClick={(choice) => this.handleCollapse(choice)}>
             {choice}
          </div>
        );
Run Code Online (Sandbox Code Playgroud)

这是handleCollapse函数:

handleCollapse(mark){
    console.log(mark);
  }
Run Code Online (Sandbox Code Playgroud)

我确保this在构造函数中绑定

  constructor(){
    super();

    this.handleCollapse = this.handleCollapse.bind(this);
  }
Run Code Online (Sandbox Code Playgroud)

Day*_*eon 11

您将事件对象传递给handleCollapse方法,而不是选择.他们读取的方式就是你所说的,当点击按钮时,执行箭头函数将事件对象传递给它,术语将使用相同的事件对象调用handleCollapse方法.试着这样做

onClick={this.handleCollapse.bind(this, choice)}

代替

  • 请注意,仅删除箭头符号函数中的参数也可以:`{()=> this.handleCollapse(choice)}`. (4认同)