Reactjs 如何在react链接组件上使用onClick事件？

我正在使用来自reactjs路由器的链接组件，无法使onClickevent正常工作。代码如下：

<Link to={this.props.myroute} onClick='hello()'>Here</Link>

这里

---

这是一种方法还是另一种方法？

您以字符串形式传递

hello（）

，同时

hello（）

表示立即执行

hello

试一试

您应该使用以下选项：

<Link to={this.props.myroute} onClick={hello}>Here</Link>

    const someValue = 'some';  
....  
    <Link to={this.props.myroute} onClick={() => hello(someValue)}>Here</Link>

更新：对于ES6和最新版本，如果要使用click方法绑定某些参数，可以使用以下方法：

<Link to={this.props.myroute} onClick={hello}>Here</Link>

    const someValue = 'some';  
....  
    <Link to={this.props.myroute} onClick={() => hello(someValue)}>Here</Link>

const someValue='some'；
....  
你好（someValue）}>这里

我不认为这是一个通用的好模式。Link将运行onClick事件，然后导航到该路由，因此导航到新路由时会有轻微延迟。一个更好的策略是像您所做的那样使用“to”属性导航到新路由，并且在新组件的componentDidMount（）函数中，您可以启动hello函数或任何其他函数。它会给你同样的结果，但路线之间的过渡要平滑得多

---

在上下文中，我在用链接上的onClick事件更新我的redux存储时注意到了这一点，它在安装新路由的组件之前造成了大约0.3秒的白屏延迟。没有涉及api调用，所以我很惊讶延迟如此之大。但是，如果您只是在控制台上记录“hello”，那么延迟可能并不明显

或者更好的

this.hello.bind（this）

^实际上，您应该始终在构造函数中绑定操作，因为绑定方式可能会导致性能问题。需要链接“to”，但通常我只需要onClick（），目前，我必须执行类似于

删除

的操作。我希望“to”在这里是可选的。@newman为什么要使用

链接而不使用
to
？如果您不需要它，那么使用
onClick
方法，只需一些其他组件，例如
，就可以了。在转换到新路由之前，我在当前组件中有一个回调url，保存在
onClick
中的cookie中。我不会在下一个组件中得到回调url，所以我需要在转换之前这样做。你还有别的选择吗？PS：回调url即使在刷新后也应该是可访问的，因此可以将其保存在存储中。如果您使用react导航：我会说不要使用链接，只使用TouchableOpacity或TouchableWithoutFeedback，然后在onPress函数中，您可以导航并将url作为nav参数传递
onPress={（）=>{this.props.navigation.navigate（'NameOfNextScreen'，{callbackUrl:'http://.callbackUrl.com“，}）；
如果您不使用react导航，我只使用链接的onClick，不必担心轻微的性能问题。它可能不会引起注意。很好的建议！谢谢！