反应路由器重定向条件 [英] React Router Redirect Conditional

问题描述

我正在尝试创建一个按钮，仅在正确完成验证后才将用户重定向到新页面。

I'm trying to make a button that only redirects the user to a new page after validation is completed correctly.

有没有办法做这样的事情？
如何在类方法中激活路线？

Is there a way of doing something like this? How to I get a Route to be activated inside of a class method?

import validator from './validator';

class Example {

  constructor(props) {
    super(props)
    this.saveAndContinue = thos.saveAndContinue.bind(this)
  }

  saveAndContinue () {
    var valid = validator.validate(this.props.form)
    if (valid) {
      axios.post('/path')
      <Redirect to='/other_tab'>
    } else {
      validator.showErrors()
    }
  }

  render() {
    <button onClick={this.saveAndContinue}>Save and Continue</button>
  }

}

推荐答案

如前所述，您应该通过 this.props.history 访问 history 对象，如此处。

As discussed you should have access to the history object via this.props.history as described here.

如果查看 push 函数，这会将您重定向到您需要的任何路线。
例如：

If you look into the push function this will redirect you to any route you need. For example:

// Use push, replace, and go to navigate around.
this.props.history.push('/home', { some: 'state' })

https://reacttraining.com/react-router/web/api/历史

这篇关于反应路由器重定向条件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！