Question

是否有更简单的方法可以从组件访问Router对象来执行调用transitionTo()而不使用导航mixin的操作？这是ES6组件。目前在按钮点击等事件上，我一直在写这样的事情：

class Button extends React.Component {
  handleClick(e) {
    e.preventDefault();
    var router = this._reactInternalInstance._context.router;
    router.transitionTo('/search');
  }

  render() {
    return (
      <button onClick={this.handleClick.bind(this)}>
        {this.props.children}
      </button>
    );
  }
}

Answer 1

根据Mat Gessel的评论，在构造函数中添加上下文作为参数将允许您访问路由器。

class Button extends React.Component {
  constructor(props, context) {
    super(props, context);
    this.context = context;      
  }

  handleClick(e) {
    e.preventDefault();
    this.context.router.transitionTo('/search');
  }

  render() {
    return (
      <button onClick={this.handleClick.bind(this)}>
        {this.props.children}
      </button>
    );
  }
}

Button.contextTypes = {
  router: React.PropTypes.object.isRequired
};

使用router.transitionTo（）而不使用Navigation mixin

1 个答案: