6-1 中列表项的 onClick 的传参问题

Question

6-1 UI组件和容器组件中
<List
style={{marginTop: 10, width: 300}}
bordered
dataSource={this.props.list}
renderItem={(item, index) => (
<List.Item onClick={() => {this.props.handleItemDelete(index)}}>
{item}
</List.Item>
)}
/>

上面代码中 onClick={() 小括号中不能传index，如果写成 (index) => 的话，index就为空了，无论点击list中的任意一项，删除的都是第一项，我自己试好久发现的，视频中代码应该是错了，老师恰好总是点击的第一项。至于为什么小括号中写入index, index就没值我就不知到为什么了

Answer 1

qq_慕哥3569984 2021-01-28 15:46:18

我回答一下你的问题，如果没有在小括号中写index，则箭头函数的函数体上的index来源于renderItem那个箭头函数的index。如果在小括号中写了index，则箭头函数的函数体上的index就是小括号中的index，但是小括号中的index是没有任何意义的。

Answer 2

qq_慕桂英3297117 2021-02-16 18:02:10

请问这块是怎么解决的,我也遇到了

• toseeabetterme #1

  把最后面的index删掉
  renderItem={(item,index) =>  (<List.Item onClick={() => {this.props.handleDeleteItem(index)}}>{item}</List.Item>)}

• hahaha225 回复 toseeabetterme #2

  感谢同学

Answer 3

Dell 2020-12-06 22:52:43

你说的对，我这快传值有问题