react-router 3 中的 useRouterHistory，createHistory 到了 react-router 4 变成了什么？？

react-router 3 文档： https://github.com/ReactTraining/react-router/blob/v3/docs/API.md

react-router 4 文档： https://reacttraining.com/react-router

1. react-router 3 中的 useRouterHistory(createHistory) ：

依赖： react-router,redux-simple-router

作用：useRouterHistory is a history enhancer that configures a given createHistory factory to work with React Router.

This allows using custom histories in addition to the bundled singleton histories.

It also pre-enhances the history with the useQueries and useBasename enhancers from history.

useRouterHistory是一个history增强器，它将给定的createHistory工厂配置为使用React Router。

这允许使用除了捆绑的单例(单例模式：一个类只能有一个实例存在，并且只返回一个对象)历史之外的自定义历史。

它还通过历史记录中的useQueries和useBasename增强器预先增强了历史history

用法：src => store => index.js

import createHistory from 'history/lib/createHashHistory'

import {useRouterHistory} from 'react-router'

import {syncHistory} from 'redux-simple-router'

export const history = useRouterHistory(createHistory)({queryKey: false});

export const reduxRouterMiddleware = syncHistory(history);

export default function configureStore(preLoadedState) {

return createStore(

rootReducer,

preLoadedState,

applyMiddleware(..., reduxRouterMiddleware, ...)

)

}

src => main.js

import configureStore, {history, reduxRouterMiddleware} from './store'

import App from './containers/App.js'

export const store = configureStore()

reduxRouterMiddleware.listenForReplays(store)

ReactDom.render(

<Provider store={store}>

<Router>

<Route path="/" component={App}/>

</Router>

</Provider>,

document.getElementById('root')

)

2. react-router 4 中的 useRouterHistory(createHistory) 变成了什么 ：

react-router 4 中没有 useRouterHistory(createHistory) 这种写法了，取而代之的是 BrowserRouter。

依赖： react-router (通用库，web 和 Native 都可用),react-router-dom (web用)

用法：src => store => index.js

export default function configureStore(preLoadedState) {

return createStore(

rootReducer,

preLoadedState,

applyMiddleware(..., ...)

)

}

src => main.js

import {BrowserRouter as Router, Route} from 'react-router-dom'

import configureStore from './store'

import App from './containers/App.js'

export const store = configureStore()

ReactDom.render(

<Provider store={store}>

<Router>

<Route path="/" component={App}/>

</Router>

</Provider>,

document.getElementById('root')

)