javascript - 将行为添加到 react-router Link

Question

我的 React 应用程序中有一个带有 react-router 的 Canvas 外菜单，我正在使用 <Link to="/page/name">在菜单中。

问题是，当用户点击时，菜单不会像在加载页面的 HTML 应用程序中那样消失。

当状态反射(reflect)菜单可见时，菜单获得一个类 - 我想知道是否有一种简单的方法可以转换到链接并从菜单中删除类而不重写整个<Link>功能。

Answer 1

您可以使用常规 <a>标签而不是附加的 onClick听众。

render() {
...
<a href="#" onClick={this.handleClick.bind(this, "your/route/here"}>Click me!</a>
...
}

handleClick(myRoute, e) {
   e.preventDefault(); //prevent default <a> navigation to href (or omit the attribute)
   //remove your class here
   this.context.router.push(myRoute);
}

您还需要获得 router上下文类型，如果您还没有:

static contextTypes = {
  router: React.PropTypes.object
}