[TOC] ### 1. 创建要跳转的页面 ~~~ //src>routes>DetailPage.js import React from 'react'; import { connect } from 'dva'; function DetailPage() { return ( <div> <h1>detail</h1> </div> ); } DetailPage.propTypes = { }; export default connect()(DetailPage); ~~~ ### 2. 配置link标签(在要使用跳转的页面) > 方式一（可与react相同） > 1. import { Link } from 'react-router-dom' > 2. <Link to={'/detail/'}>跳转</Link> > 方式二（传参） > 1. import { Link } from 'dva/router'; > 2.<Link to={{pathname:'/detail/', query:{foo: 'foo', boo:'boo'}, state:{data:'hello'} }}>跳转</Link> ~~~ //跳转页面接收参数 import React from 'react'; import { connect } from 'dva'; function DetailPage(props) { { console.log(props) } return ( <div> <div>{props.location.state.data}</div> </div> ); } export default connect()(DetailPage); ~~~ ### 3. 配置router.js ~~~ //src>router.js import React from 'react'; import { Router, Route, Switch } from 'dva/router'; import IndexPage from './routes/IndexPage'; + import DetailPage from './routes/DetailPage'; function RouterConfig({ history }) { return ( <Router history={history}> <Switch> <Route path="/" exact component={IndexPage} /> + <Route path="/detail" exact component={DetailPage} /> </Switch> </Router> ); } export default RouterConfig; ~~~