react-router v4 - browserHistory未定义

Question

我正在创建我的第一个电子反应应用程序(我的第一个电子应用程序).我有两条路线需要从一条路线导航到另一条路线.为此,我使用以下代码:

根

ReactDOM.render(
  <Router history={browserHistory}>
      <App />
  </Router>,
  document.getElementById('root')
);

应用

class App extends React.Component {
    constructor() {
        super();
    }
    render() {
        return (
            <div className="app-master">
                <Switch>
                    <Route path='/city' component={CityList}/>
                    <Route path='/' component={SplashScreen}/>
                </Switch>
            </div>
        )
    }
}

页

import { browserHistory } from 'react-router';
...
browserHistory.push('/city');

这条线给出错误,

TypeError: Cannot read property 'push' of undefined

我在网上搜索可能的解决方案,但找不到一个!关于SO也有很多类似的问题,但没有一个对我有用:(

Answer 1

您必须从历史记录模块导入它,它提供了3种不同的方法来创建不同的历史记录.

• createBrowserHistory用于支持历史API的现代Web浏览器
• createMemoryHistory 用作参考实现,也可用于非DOM环境,如React Native或测试
• createHashHistory 用于旧版Web浏览器

您不能在电子环境中使用浏览器历史记录,使用哈希值或内存.

import { createHashHistory } from 'history'

const history = createHashHistory()

然后你可以使用history注入道具

this.props.history.push('/')