- vue-router 與 react-router 設計理念上的區別:
區別 | vue-router | react-router |
---|---|---|
改成history | mode: 'history' | 直接使用 react-router 的話,用 BrowserRouter 將<App> 包裹起來,或引入history(推薦,history可用於頁面組件之外導航,此時就可以不用react-router-redux) |
- 頁面組件之外導航,2種實現方式:
- react-router-redux
react-router-redux 讓你可以在任何地方通過 dispatch 處理頁面跳轉,如:store.dispatch(push('/')) - history
安裝npm install history
;
不使用 react-router-dom 提供的 BrowserRouter 而是自己實現一個。
history.js:
import createHistory from 'history/createBrowserHistory';
const history = createHistory();
export default history;
組件內引用:
import history from './history';
組件內使用:
history.push('/')
在任何地方只要引用 history 就可以使用它進行導航操作,如 history.push('/')