Question

我正在尝试按照Stack Overflow上的示例进行操作，但我无法使其工作。如果我删除所有说“索引”的东西，它的工作正常。它通过“页面”就好了。有人能指出我正确的决定，谢谢你。

我的点击功能

handleOnClick(page, index) {
    console.log(page);  //page is correct
    console.log(index); //undefined

}

我的渲染

let self = this;

    playlistList[pos].list.map(function(page, index)

    {if (page.selected) {
      return (
        <tr key={page.id} onClick={() => self.handleOnClick(page, index)}>
          <td>{page.name}</td>
          <td>{page.subComposition.name}</td>
        </tr>
      );}
    }

Answer 1

你可能最好制作一个处理创建tr的组件。然后在该组件中创建函数，然后使用传递的props运行该函数。

除非您需要更改状态，否则将该函数传递给要使用的组件。

Answer 2

您必须通过箭头功能parentesis传递参数名称，并通过功能parentesis传递它的值。

喜欢：

onClick={(page, index) => self.handleOnClick(page, index)}

Answer 3

您确定您的功能handleOnClick是否正确？我认为参数是错误的。

当你调用函数时，你传递了handleOnClick(page, index)，并且在方法中参数为handleOnClick(index, page)

React，点击后获取列表索引

3 个答案: