创建页面---基于Ant-Design-Pro-2-0-的CMS管理后台入门系列
2019-01-07 11:16
726 查看
拉取项目 luwei.web.study-ant-design-pro, 切换至
page分支,可看到创建页面的效果
启动项目
前置:安装完依赖包,若未安装,请移步 安装项目依赖包
运行命令启动项目:
npm start
若使用 yarn 安装的用户请运行:
yarn start
创建页面
在项目根目录下执行命令
umi g page FormDemo1
在
pages文件夹上就可看到两个新增文件
新建一个同名的文件夹,把这两个文件放在一起,目录结构如下
路由配置
找到
./config/router.config.js文件
增加路径配置
// formDemo { path: '/FormDemo', name: 'Form Demo', icon: 'dashboard', component: '../layouts/UserLayout', routes: [ { path: '/FormDemo/FormDemo1', name: 'Form Demo1', component: './FormDemo1/FormDemo1', }, ], },
保存,点击左侧边栏的菜单,如图所示
作者简介:李尧晖,芦苇科技web前端开发工程师,代表作品:飞花亭小程序、续航基因、YY表情红包、YY叠方块直播竞赛小游戏。擅长网站建设、微信公众号开发、微信小程序开发、小游戏制作、企业微信制作、H5建设,专注于前端框架、服务端渲染、SEO技术、交互设计、图像绘制、数据分析等研究。
欢迎和我们一起并肩作战: web@talkmoney.cn
访问 www.talkmoney.cn 了解更多
提供深圳微信公众号外包,高质量的钉钉开发,专业的企业微信建设,东莞微信小程序开发,广州小游戏制作,广东H5建设
相关文章推荐
- 极客react之Ant Design Pro系列快速入门(七)-- 使用新的布局
- 极客react之Ant Design Pro系列快速入门(三)--菜单与权限
- 极客react之Ant Design Pro系列快速入门(九)-- 使用地图(高德地图)
- 极客react之Ant Design Pro系列快速入门(五)--更改控件的默认样式
- 极客react之Ant Design Pro系列快速入门(六)--绑定model
- 极客react之Ant Design Pro系列快速入门(二)--登录与默认路径篇
- 极客react之Ant Design Pro系列快速入门(四)--界面新增
- 极客react之Ant Design Pro系列快速入门(一)--启动篇
- 前端武器库系列之html后台管理页面布局
- vue-admin-pro使用vue开发的中后台管理解决方案ant desgn pro设计风格
- 【tornado】系列项目(一)之基于领域驱动模型架构设计的京东用户管理后台
- ant-design-pro开发说明 --创建
- Ant Design Pro快速入门
- Ant Design Pro快速入门
- (转)淘淘商城系列——展示后台管理页面
- ant design pro 新增页面
- asp.net mvc+jquery easyui开发实战教程之网站后台管理系统开发4- 后台模板html页面创建
- Part 2:模型与后台管理admin站点--Django从入门到精通系列教程
- 基于YIi的三栏frameset框架后台管理页面的实现
- 使用Ant Design Pro,一个企业级开箱即用的中后台前端