一、更新点
1、目录调整
2、本地代理服务器调整
roadhog→umi
配置方式
在这个config/config.js配置
"proxy": { "/api": { "target": "http://jsonplaceholder.typicode.com/", "changeOrigin": true, "pathRewrite": { "^/api" : "" } } }
在config/config.js文件中,最上面提示: https://umijs.org/config/ 查看这里的配置应该都可以配置到这里
3、路由菜单方式
4、routes变为pages
5、pages中含有models
二、新建页面
1、在/config/router.config.js文件中添加
{
path: '/newpage',
name: 'newpage',
icon: 'dashboard',
routes: [
{
path: '/newpage/page1',
name: 'page1',
component: './Newpage/Page1',
},
],
},
2、添加实际页面
在src的pages下增加Newpage,并且在Newpage中添加
import React, {Component} from 'react';
import {connect} from 'dva';
import {formatMessage, FormattedMessage} from 'umi/locale';
import {
Row,
Col,
Icon,
Card,
Tabs,
Table,
Radio,
DatePicker,
Tooltip,
Menu,
Dropdown,
} from 'antd';
import {
ChartCard,
MiniArea,
MiniBar,
MiniProgress,
Field,
Bar,
Pie,
TimelineChart,
} from '@/components/Charts';
import Trend from '@/components/Trend';
import NumberInfo from '@/components/NumberInfo';
import numeral from 'numeral';
import GridContent from '@/components/PageHeaderWrapper/GridContent';
import Yuan from '@/utils/Yuan';
import {getTimeDistance} from '@/utils/utils'; @connect(({page1, loading}) => ({
page1,
loading: loading.effects['page1/fetch'],
}))
class Page1 extends Component {
componentDidMount() {
const {dispatch} = this.props;
dispatch({
type: 'page1/fetch',
});
} render() {
const {page1} = this.props;
console.log(page1)
alert(page1);
return (
<GridContent>
<Row gutter={24}>
<Col>
test
</Col>
</Row>
</GridContent>
);
}
} export default Page1;
3、添加国际化
在/src/locales下的两个文件中添加对应的Key
'menu.newpage': '心页面',
'menu.newpage.page1': '页面1',