Question

我试图以某种方式在自定义组件上调用“preventDefault”而没有成功。这是我的尝试。第一次使用“e”尝试传递元素引用而不是实际事件。第二种方法传递事件，但是prevent default方法不会阻止任何事情。这样做的最佳方式是什么？

<MyComponent header= {
    <div onClick={e => { e.preventDefault(); myFunction.bind(this, event) }}>
       Header
    </div> 
} />

function myFunction(event) {
   event.preventDefault();
}

Answer 1

我会这样做：

<MyComponent header={<div onClick={myFunction}>Header</div>} />

function myFunction(event) {
   event.preventDefault();
}

或者，如果您需要在点击处理程序中使用this：

class App extends React.Component {
  myFunction = (event) => {
    event.preventDefault();
    this.setState({ clicked: true });
  }

  render () {
    return (
      <MyComponent header={<div onClick={this.myFunction}>Header</div>} />
    )
  }
}

如何在ReactJS中的onClick中传递事件

1 个答案: