作为transitionTo的反应替代路由器 - 函数中的4.1.1转换

时间:2017-07-08 14:34:45

标签: reactjs react-router-dom

我正在使用react-router-dom alpha,'transitionTo'是路由更改的可用方法。这似乎从4.1.1中删除了,只是好奇最好的方法是什么。我试图捕捉输入中输入的内容并将其用作动态路线的一部分。我的组件内部的相关代码如下。

goToRoute(event) {
          event.preventDefault();
          this.context.router.transitionTo(`route/${this.storeInput.value}`)
        }

  render() {
    return (
      <form onSubmit={(e) => this.goToRoute(e)}>
        <h2>Please Enter Name</h2>
        <input type="text" required placeholder="Enter Name" ref={(input) => {this.storeInput = input } } />
        <button type="submit">Lets Go</button>
      </form>
   )
 }

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

1 个答案:

答案 0 :(得分:2)

来自@Shubham的帖子,谢谢!

goToRoute(event) {
          event.preventDefault();
          this.props.history.push(`route/${this.storeInput.value}`)
        }

  render() {
    return (
      <form onSubmit={(e) => this.goToRoute(e)}>
        <h2>Please Enter Name</h2>
        <input type="text" required placeholder="Enter Name" ref={(input) => {this.storeInput = input } } />
        <button type="submit">Lets Go</button>
      </form>
   )
 }

ComponentName.contextTypes = {
  router: React.PropTypes.object
}
相关问题