javascript - React onClick 函数参数变成 "Proxy"对象

Question

我在我的 react 层次结构的顶层有一个元素数组，我想用一个带有元素值(字符串)的参数来触发一个 onClick 函数。然而，当我尝试打印这个值时，打印了一个“Proxy”对象: p>

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

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

        return (
          <div className="collapseChoice"
             onClick={(choice) => this.handleCollapse(choice)}>
             {choice}
          </div>
        );

这里是 handleCollapse 函数:

handleCollapse(mark){
    console.log(mark);
  }

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

  constructor(){
    super();

    this.handleCollapse = this.handleCollapse.bind(this);
  }

Answer 1

您将事件对象传递给您的 handleCollapse 方法，而不是选择。 他们这样读是你告诉 react ，当单击按钮时执行箭头函数将事件对象传递给它，这在术语中将使用相同的事件对象调用 handleCollapse 方法。 尝试这样做

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

代替