大佬教程收集整理的这篇文章主要介绍了在提交表单时进行React Router v4重定向，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
您必须返回Redirectrender方法（否则将不会被渲染，因此将不会发生重定向）：
render() {
const redirectToReferrer = this.state.redirectToReferrer;
if (redirectToReferrer === truE) {
return <Redirect to="/home" />
}
// ... rest of render method code
}
全新的响应，在“登录”页面上单击“提交”后尝试重定向到“主页”。尝试遵循React Router教程。
当我单击表单上的提交按钮并在控制台上记录状态和fakeAuth.isAuthenticated时，它们都返回true。但是，重定向不会触发。
Login.js
class Login extends Component {
constructor(props) {
super(props);
this.state = {
portalId: "",password: "",redirectToReferrer: false
}
this.handleSubmit = this.handleSubmit.bind(this);
}
handleSubmit(E) {
fakeAuth.authenticate(() => {
this.setState({
portalId: this.refs.portalId.value,password: this.refs.password.value,redirectToReferrer: true
})
})
e.preventDefault();
}
render() {
const redirectToReferrer = this.state.redirectToReferrer;
if (redirectToReferrer === truE) {
<Redirect to="/home" />
}
Routes.js
export const fakeAuth = {
isAuthenticated: false,authenticate(cb) {
this.isAuthenticated = true
setTimeout(cb,100)
},signout(cb) {
this.isAuthenticated = false
setTimeout(cb,100)
}
}
const PrivateRoute = ({ component: Component,...rest }) => (
<Route {...rest} render={() => (
fakeAuth.isAuthenticated === true
? <Component {...this.props}/>
: <Redirect to="/" />
)}/>
)
export default () => (
<BrowserRouter>
<div>
<Navbar />
<Switch>
<Route path="/" exact component={Login} />
<Route path="/register" exact component={Register} />
<Route path="/home" exact component={HomE} />
</Switch>
</div>
</BrowserRouter>
);
以上是大佬教程为你收集整理的在提交表单时进行React Router v4重定向全部内容，希望文章能够帮你解决在提交表单时进行React Router v4重定向所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。