在锚元素上反应传递事件和参数

Question

我在react组件中有一个anchor元素，我想为它传递事件和参数。下面的代码不起作用。它抛出e.preventDefault();无功能错误。我怎么能这样做？

loadComponent(e, component) {
  e.preventDefault();
  this.setState({ componentToLoad: component });
}

<a onClick={() => this.loadComponent(this.event, <FormatName />)}>
  Format Name
</a>

Answer 1

应为onClick={e => this.loadComponent(e, <FormatName />)}。

您的setState也是错的：

this.setState({ componentToLoad: component });

此外，最好存储一个控制组件可见性的状态而不是状态中的整个组件，然后在render中进行条件渲染：

{this.state.showComponent && <FormatName />}

Answer 2

可以是onClick={() => this.loadComponent(<FormatName />)

事件将始终作为处理程序函数的第一个参数

loadComponent(e, component) { e.preventDefault(); this.setState({componentToLoad = component}); }