redux

顯示react腳手架的配置文件使用指令：npm run eject，若是出現報錯，咱們須要使用git將工做區的文件放到本地庫上，指令：git add .

將工做區的文件添加到暫存區git commit -m 'first commit'，將暫存區提交到本地庫npm run eject，此時咱們的配置文件就出來了

若是咱們想使用 css 的預編譯語言：scss，咱們須要下載 sass-loader node-sass 模塊，無需配置文件，將 css 文件改爲 scss 文件就能夠了；

　　指令：npm i sass-loader node-sass -D

　　redux 是 js 的狀態管理機，適用於 vue，react，angular，在 react 的使用率更高；

　　redux 的下載指令：npm i redux -S

　　三大原則：單一數據源，state 是隻讀的，改變他使用 action

　　案例：

　　　　

　　redux 的核心

　　　　1. store 保存數據的地方，這些數據叫 state ，必須經過 store.getState() 來獲取 state

　　　　2. reducer 是 createStore() 的第一個參數，是一個函數，主要是用來生成新的 state，主要接收兩個狀態，一個是 state，一個是 action，返回新的狀態

　　　　3. action 是一個對象，全部 state 的改變都是用戶經過視圖層 view，提交到 action，action 是改變 state 的惟一途徑

　　action 是一個對象

　　action = {

　　　　type: 'add',　　// 事件類型

　　　　payload: 1　　// 載荷，伴隨函數傳過來的參數

　　}

　　store.dispatch() 是 view 層惟一發出 action 的方法，參數是一個 action 對象

　　index.js 

　　監聽頁面的方法

　　store 是 createState() 的返回值

　　store.subscribe()，當 state 裏面的數據發生了變換，就會調用這個函數，且這個函數有個返回值，調用這個返回值，就會中止監聽裏面的事件

　　案例：在 index.js 中

　　　　

 

　　redux 的使用方法，

　　

 

　　爲何使用 action.js 文件，進行優化代碼將其分開，而後咱們經過工廠函數的每次返回不一樣的對象，因爲參數是固定的，每次返回的都是事件類型和事件數據，因此咱們可使用一個函數，經過其返回值來返回一個對象，讓後傳遞給 action ；

　　咱們的 reducer 函數有兩個參數，參數一：state，參數二：action，

　　咱們的 redux 中有一個 createStore() 的函數，參數是 reducer 函數，而且有一個返回值，就是 store，管理 redux 的 state 的數據；

　　若是咱們向渲染到頁面上，咱們就須要藉助 store.subscribe() 的函數，監聽 state，每次頁面刷新都會調用此函數，雖然每次更給都會調用此方法，但由於是 diff 算法，因此並不會影響性能；

　　因此，核心 store.js 處理邏輯，index.js 來渲染頁面，組件來提交事件