1、umi的用法
这三种用法,最后/list接受到到参数都在,this.props.location.query里面
第一种
import Link from 'umi/link';
<Link to="/list?a=b">Go to list page</Link>
import router from 'umi/router';
// 带参数
第二种
router.push('/list?a=b');
第三种
router.push({
pathname: '/list',
query: {
a: 'b',
},
});
2、普通react用法
import { withRouter } from 'react-router-dom';
this.props.history.push({
pathname: '/flow-node/list',
query: {
text: this.state.value,
},
});
export default withRouter(GlobalSearch);
3、遇到都问题
1、React.createClass is not a function
var Home = React.createClass({
render:function(){
return (
<div>123</div>
)
}
})
//变成
class Home extends React.Component{
render=function(){
return (
<div>123</div>
)
}
}
2、You should not use <Route component> and <Route children> in the same route; <Route children> will be ignored
4.0以上会出问题
<HashRouter>
<Route path="/" component={App1}>
<Route component={Home}/>
<Route path="df" component={Home1}/>
<Route path="lsy" component={Home2}/>
</Route>
</HashRouter>
<HashRouter>
<App1>
<Route exact path="/" component={Home}/> //默认页
<Route path="/df" component={Home1}/>
<Route path="/lsy" component={Home2}/>
</App1>
</HashRouter>
umi的路由配置
pages文件夹下自动配置路由
$UserSet文件夹会动态配置
http://localhost:8000/User/1这个页面
也可以用config文件
routes: pageRoutes,
// router.config
/**
* 无layout的界面
* */
export default [
{
path: '/',
component: './',
},
/**
* 有layout的界面
* */
{
path: '/test',
component: '../layouts/basicLayout.js',
routes: [
{
path: '/test',
redirect: '/test/list',
},
{
path: '/test/list',
component: './Test/List',
},
// 动态
{
path: '/test/:key',
component: './Test/Dynamic/index',
},
],
},