2018年12月24號入職一家新公司，第一次接觸到react，一臉懵逼，經過一周的時間，熟悉了項目結構，router，models，services，pages，components

介紹

在官網中獲取下載地址，通過 git clone --depth=1 https://github.com/ant-design/ant-design-pro.git my-project，將官網demo復制然后npm install 初始化，安裝node-modules，npm start，可以通過http://localhost:8000訪問該項目。

路由：

在config文件夾中的router.config.js中配置了pages下面的頁面路由的嵌套

pages和components：

在pages中新建的頁面，可以用單獨的一個文件夾包含，也可以直接在pages的下一層新建，對應的有l(wèi)ess和js文件，less是樣式文件，js是邏輯和展示頁，如果需要額外添加組件，組件可以在components中寫好，在pages下面的頁面中引入

service和models：

在src下面的service新建一個js文件，在文件中引入request.js(在src中->utils->request)，如下寫的代碼

微信圖片_20190101221838.png

在models文件夾中新建一個對應的js文件，引入上面service中的js文件
export default {
namespace：××× //這里的namespace是整個項目的唯一，不可以有重復
state：{
//定義變量可以在全局訪問
}，
effects:{
//通過后臺請求獲取所需數(shù)據(jù)
},
reducers:{
//修改state變量的方法
}
}
在需要請求的頁面使用dispatch({
type:'namesapce的命名/在models中的方法名'，
payload:{
//所帶參數(shù)
}
})
前提是在這個頁面還需引入connect，注入需要使用的models中的js名稱，如果models中的是user.js,在改頁面應該這樣寫

微信圖片_20190101225812.png

要是想直接使用models中的state的變量，在connect中注入的name之前加...,如：...user
{this.props.userInfo}