Question

我正在使用javascript的map函数呈现一个列表，并且我想向该列表的元素添加点击侦听器，但是我可以这样做。

这是代码链接-https://codesandbox.io/s/oqvvr1n3vq

我想在Hello时控制台日志h1 tag is clicked。

Answer 1

onClick需要一个函数（事件处理程序），但是您正在分配一个值，这意味着console.log将立即执行，而无需单击任何标签。

解决方案是-在Dummy组件中创建一个函数，并将该函数用作点击处理程序。

赞：

onClick={() => console.log("Hello", props.display)}

或

const Dummy = props => {
  const handler = () => console.log("Hello", props.display);

  return (
    <h1 style={{ border: "1px solid black" }} onClick={handler}>
      {props.display}
    </h1>
  );
};

Working Example.

将点击侦听器附加到通过地图呈现的组件

1 个答案: