react-router4如何在js中控制组件跳转

想请问一下 react-router4如何实现在js中进行路由跳转,在网上找了很多资料 有说用browserHistory的 但是却报错。

阅读 22.7k
6 个回答

只要你在组件最外层用了BrowserRouter
那每个组件内部就this.props.history.push 就可以了

4.0我也是遇到这个问题,能不能复制你的代码看一下

<BrowserRouter history={history}>
        <App>
            <Switch>
                <Route path='/home' component={home} />
                <Route path='/mudidi' component={mudidi} />
                <Route path='/zhuanti' component={zhuanti} />
                <Route path='/daren' component={daren} />
                <Route path='/zijiayou' component={zijiayou} />
            </Switch>
        </App>
    </BrowserRouter>

图片描述

BrowserRouter 如果换成Router 就没有报这个错误

报错了

我在navigation.js导航组件写了 url跳转了 this.props.child却没有更新

图片描述

改成hashRouter模式,然后就能通过location跳转了

import { HashRouter as Router, Route, Link } from 'react-router-dom';
location.replace("#/welcome"); //或改location.hash

import { createBrowserHistory } from 'history';

createBrowserHistory().push('');

新手上路,请多包涵

给你贴个 react-router 官方文档的图
你只需要把const customHistory = createBrowserHistory()那行,单独放个文件
然后在你的 ajax 封装里 require 这个文件,就可以了。

宣传栏