• 1.9k

在组件中,异步请求之后,数据存到 redux,然后怎么跳转路由??

情景是这样子滴

登录组件 dispatch 登录的 anction 请求成功之后 怎么跳转路由??

登录组件

handleSubmit = (e) => {
    e.preventDefault();
    this.props.form.validateFields((err, values) => {
      if (!err) {
        store.dispatch(toLogin({
          username: values.username,
          password: values.password
        }));
        // 接口请求成功成功 怎么跳转路由?
      }
    });
  }
阅读 1.7k
评论
    4 个回答
    • 1.9k

    reudx-chunk这个可以传一个函数进去。dispach里面,可以写一些回调函数

      history.js

      //也可以选HashHistory

      import { createBrowserHistory } from 'history'
      export default createBrowserHistory()

      中间件代码

      import { history } from './history'
      //routerPath 登录成功后跳转的路由
      history.push(routerPath)
        • 269

        你好,关于react-rounte 有三种方式可以进行跳转。

        1.使用link 标签跳转
        <li><Link to="/about">About</Link></li>

        2.使用browserHistory.push 解决用户表单跳转,点击按钮跳转的操作
        下面是一个表单
        <form onSubmit={this.handleSubmit}>
        <input type="text" placeholder="userName"/>
        <input type="text" placeholder="repo"/>
        <button type="submit">Go</button>
        </form>

        import { browserHistory } from 'react-router'

        handleSubmit(event) {

        event.preventDefault()
        const userName = event.target.elements[0].value
        const repo = event.target.elements[1].value
        const path = `/repos/${userName}/${repo}`
        browserHistory.push(path)   

        },

        3.使用context 对象

        export default React.createClass({
        // ask for router from context
        contextTypes: {

        router: React.PropTypes.object

        },

        handleSubmit(event) {

        // ...
        this.context.router.push(path)

        },
        })

        针对你的情况,在2,3中任意选择一种即可

          1、点击跳转用react-router 就行, <Link to=""></Link>
          2、<Route path="" Componeds={跳转的组件} ></Route>
          3、如果想用哈希值改变时, window.hash(), 也可以直接跳转。

            撰写回答

            登录后参与交流、获取后续更新提醒

            相似问题
            推荐文章