前言
在antd-pro基礎(chǔ)上修改,根據(jù)公司項目內(nèi)容搭建新的框架,用于項目初期快速上手,避免重復(fù)造輪子。
必備技能
react(https://react.docschina.org/)
umi--路由配置(https://umijs.org/)
dva--數(shù)據(jù)流方案(https://dvajs.com/guide/)
環(huán)境安裝
npm:使用npm命令管理node包。在node.js官網(wǎng)(https://nodejs.org/zh-cn/)下載node包并進(jìn)行安裝,命令:node -v 即可查看node版本。
yarn:推薦使用 yarn 管理 npm 依賴,命令:npm i yarn tyarn -g
項目介紹
項目框架
1.config:配置,config->router.fonfig為路由配置文件
2.src:頁面內(nèi)容文件,
src->component:相關(guān)組件
src-layouts:布局文件
src->models:model,并不是對象的相關(guān)屬性定義,而是對象的相關(guān)操作,例如登陸,退出操作
src->pages:模塊界面文件
src->services:接口文件,定義相關(guān)接口
src->utils:工具文件
src->utils->request:網(wǎng)絡(luò)請求封裝
3.defaultSettings.js: 默認(rèn)配置文件,baseUrl便放在這里
相關(guān)操作
1.新建界面
在pages下新建模塊或者在已有模塊下新建頁面
2.給新建頁面添加路由
在config->router.config.js中,已經(jīng)配好了目前的界面路由,包括user和app兩部分,各自擁有自己的layout,如果需要添加新的layout,可以按照樣式自己添加。參數(shù)查看代碼注釋或者umi文檔
3.根據(jù)需求添加model
4.根據(jù)需求添加相關(guān)接口api