渲染后在元素上添加onClick事件的正确方法是什么?

时间:2018-11-18 04:55:23

标签: reactjs

我只想在列表(数组)的元素上添加onClick事件

class App extends React.Component {
  constructor(){
    super();
    this.state = {
      list: ['Value1','Value2']
    }
  }
  render(){
    return (
      <div className="App">
        {this.state.list.map(data => {
          return data
        })} // How can I add onClick event only on 'Value1' after it rendered?
      </div>
    );
  }
}

我的解决方法是:

const [Value1,Value2] = this.state.list
value1.addEventListener('click',function(){})

但似乎不起作用。

1 个答案:

答案 0 :(得分:1)

import javax.swing.*; import java.awt.*; import java.awt.event.MouseEvent; import java.awt.event.MouseListener; public class A extends JApplet { private class B extends JApplet implements MouseListener{ public B() { } public void paint (Graphics g) { // g.drawline ... //System.out... } public void mousePressed(MouseEvent e) { //System.out.... repaint(); } public void mouseReleased(MouseEvent e) { //System.out.... repaint(); } // ... rest of mouse listener interface } public void init() { // setSize() ... } public void paint(Graphics g) { // g.drawRectange ... // Draw other stuff B b = new B(); B.paint(g) } } 中,您可以在组件中绑定React。您可以在此处了解有关事件处理的更多信息:https://reactjs.org/docs/handling-events.html

您的代码可以更改为此:

onClick