如何将处理程序绑定到列表中的每个项目？

Question

示例：

 onMouseOver={() => this.hover(event.target.getAttribute('name'))}
 onMouseOut={() => this.hover(false)}

每个元素都是开处方所必需的 -

docker run --privileged docker:stable-dind docker run hello-world

有很多元素，是否可以指定这些处理程序而无需为每个元素指定它们？

Answer 1

我的建议是使用map，首先定义你的对象数组。

const allData = [
  {key: 1, name:'one'},
  {key: 2, name:'two'},
  {key: 3, name:'three'},
  {key: 4, name:'four'}
]

allData.map((data) => {
  <li 
    name=data.name
    onMouseOver={() => this.hover(event.target.getAttribute('name'))}
    onMouseOut={() => this.hover(false)}
  >
    data.key
  </li>
})