在使用React Router V4进行一些验证后,如何移动到新页面?我有这样的事情:
export class WelcomeForm extends Component { handleSubmit = (e) => { e.preventDefault() if(this.validateForm()) // send to '/life' } render() { return ( <form className="WelcomeForm" onSubmit={this.handleSubmit}> <input className="minutes" type="number" value={this.state.minutes} onChange={ (e) => this.handleChanges(e,"minutes")}/> </form> ) } }
我想将用户发送到另一条路线.我看了一下Redirect,但似乎它会删除我不想要的历史记录中的当前页面.
您正在使用
react-router v4,因此您需要将
withRouter与您的组件一起使用以访问历史对象的属性,然后使用history.push动态更改路由.
You can get access to the history object’s properties and the closest
‘s match via the withRouter higher-order component. withRouter
will re-render its component every time the route changes with the
same props as render props: { match,location,history }.
像这样:
import {withRouter} from 'react-router-dom'; class WelcomeForm extends Component { handleSubmit = (e) => { e.preventDefault() if(this.validateForm()) this.props.history.push("/life"); } render() { return ( <form className="WelcomeForm" onSubmit={this.handleSubmit}> <input className="minutes" type="number" value={this.state.minutes} onChange={ (e) => this.handleChanges(e,"minutes")}/> </form> ) } } export default withRouter(WelcomeForm);
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。