react+umi+dva框架

前言

在antd-pro基础上修改,根据公司项目内容搭建新的框架,用于项目初期快速上手,避免重复造轮子。

必备技能

react(https://react.docschina.org/
umi--路由配置(https://umijs.org/
dva--数据流方案(https://dvajs.com/guide/

环境安装

npm:使用npm命令管理node包。在node.js官网(https://nodejs.org/zh-cn/)下载node包并进行安装,命令:node -v 即可查看node版本。
yarn:推荐使用 yarn 管理 npm 依赖,命令:npm i yarn tyarn -g

项目介绍

项目框架

1.config:配置,config->router.fonfig为路由配置文件
2.src:页面内容文件,
src->component:相关组件
src-layouts:布局文件
src->models:model,并不是对象的相关属性定义,而是对象的相关操作,例如登陆,退出操作
src->pages:模块界面文件
src->services:接口文件,定义相关接口
src->utils:工具文件
src->utils->request:网络请求封装
3.defaultSettings.js: 默认配置文件,baseUrl便放在这里

相关操作

1.新建界面
在pages下新建模块或者在已有模块下新建页面
2.给新建页面添加路由
在config->router.config.js中,已经配好了目前的界面路由,包括user和app两部分,各自拥有自己的layout,如果需要添加新的layout,可以按照样式自己添加。参数查看代码注释或者umi文档
3.根据需求添加model
4.根据需求添加相关接口api

猜你喜欢

转载自blog.csdn.net/weixin_34336292/article/details/90771917