版本：【 "JYadmin-react-antd": "^1.0.0"】
著作權所有：微信公眾號【微新悅】 原文鏈接：https://www.weixinyue.cn/frontCourses/#/JYAdminReactAntd1.0/1（閱讀效果更佳） 文章說明：本課題會帶大家從零到一打造一套基于react+antd封裝的優秀后臺模板集成方案
第一節：【react+antd 基礎框架搭建（登錄）】
第一步：使用create-react-app腳手架創建一個專案
create-react-app my-project
第二步：修改埠號
"start": "set PORT=9000 && react-scripts start"
說明：
在根目錄【package.json】的【scripts】物件里修改【start】為上述命令
第三步：配置@符號-資源路徑指向
（1）、執行 npm run eject （2）、在config/webpack.config.js檔案的alias中插入代碼 （3）、'@': path.resolve('src')
說明： 運行npm run eject此命令會把 react-scripts 封裝的一些webpack配置等全部解壓到專案目錄，專案結構中
第四步(1)：配置路由模塊
cnpm install --save react-router react-router-dom
第四步(2)：修改根目錄App.js代碼
ui效果：如下圖
第五步：撰寫后臺管理系統登錄頁（ES6 class 來定義一個組件）
第五步(1)、class組件基本構成
第五步(2)、引入antd 按需加載
cnpm install --save antd cnpm i babel-plugin-import -D
互動效果：如下視頻
1、css使用行內元素 js檔案配置
2、使用antd form表單以及實作表單輸入校驗
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/237515.html
標籤：其他
下一篇：定位 position