dva的簡介

（1）dva 是基於現有應用架構 (redux + react-router + redux-saga 等)的一層輕量封裝，沒有引入任何新概念，所有代碼不到 100 行。

（2）dva 是 framework，不是 library，很明確地告訴你每一個部件應該怎麼寫。除了 react 和 react-dom 是 peerDependencies 之外，dva 封裝了全部其餘依賴。
（3）dva 實現上儘可能不建立新語法，而是用依賴庫自己的語法，好比 router 的定義仍是用 react-router 的 JSX 語法。
（4）dva最核心的是提供了 app.model 方法，用於把 reducer, initialState, action, saga 封裝到一塊兒，好比：
                app.model({
                           namespace: 'products',
                           state: {
                           list: [],
                           loading: false,
                         },
                         subscriptions: [
                           function(dispatch) {
                             dispatch({type: 'products/query'});
                           },
                         ],
                         effects: {
                           ['products/query']: function*() {
                             yield call(delay(800));
                             yield put({
                               type: 'products/query/success',
                               payload: ['ant-tool', 'roof'],
                             });
                           },
                         },
                         reducers: {
                           ['products/query'](state) {
                             return { ...state, loading: true, };
                           },
                           ['products/query/success'](state, { payload }) {
                             return { ...state, loading: false, list: payload };
                           },
                         },
                       });
（5）介紹下這些 model 的 key 
         namespace： reducer 在 combine 到 rootReducer 時的 key 值
         state：reducer 的 initialState
         subscription：是一種從源獲取數據的方法，它來自於 elm
         effects： saga，並簡化了使用
         reducers：純函數
（6）來源：https://github.com/dvajs/dva/issues/1

附一：axios 簡介（不完整）
（1）從瀏覽器中建立 XMLHttpRequest
（2）支持 Promise API
（3）攔截請求和響應
（4）自動轉換JSON數據

附二：Fetch
（1）Fetch 是一個現代的概念, 等同於 XMLHttpRequest。它提供了許多與XMLHttpRequest相同的功能，但被設計成更具可擴展性和高效性。
（2）Fetch 的核心在於對 HTTP 接口的抽象，包括 Request，Response，Headers，Body，以及用於初始化異步請求的 global fetch。
（3）得益於 JavaScript 實現的這些抽象好的 HTTP 模塊，其餘接口可以很方便的使用這些功能。
（4）Fetch 還利用到了請求的異步特性——它是基於 Promise 的。
         來源：https://developer.mozilla.org/zh-CN/docs/Web/API/Fetch_API

附三：redux-saga
（1）在 reducers 中的全部操做都是同步的而且是純粹的，即 reducer 都是純函數。
         純函數是指一個函數的返回結果只依賴於它的參數，而且在執行過程當中不會對外部產生反作用。
（2）在實際的應用開發中，會有一些異步的（如Ajax請求）且不純粹的操做（如改變外部的狀態），這些在函數式編程範式中被稱爲「反作用」。
（3）Redux 的做者將這些反作用的處理經過提供中間件的方式讓開發者自行選擇進行實現。
（4）和redux-thunk同樣，redux-saga 就是用來處理上述反作用（異步任務）時，redux的一箇中間件。r
（5）edux-saga 提供了一些輔助函數，發起特定的 action 到 Store 時，派生任務。

附四：effect
（1）Effect 被稱爲反作用，在咱們的應用中，最多見的就是異步操做。
（2）它來自於函數編程的概念，之因此叫反作用是由於它使得咱們的函數變得不純，一樣的輸入不必定得到一樣的輸出。
（3）dva 爲了控制反作用的操做，底層引入了redux-sagas作異步流程控制，
         因爲採用了generator的相關概念，因此將異步轉成同步寫法，從而將effects轉爲純函數。
（4）以 key/value 格式定義 effect。用於處理異步操做和業務邏輯，不直接修改 state。
         由 action 觸發，能夠觸發 action，能夠和服務器交互，能夠獲取全局 state 的數據等等。

附五：數據流向
（1）數據的改變發生一般是經過用戶交互行爲或者瀏覽器行爲（如路由跳轉等）觸發的，當此類行爲會改變數據的時候能夠經過 dispatch 發起一個 action，
（2）若是是同步行爲會直接經過 Reducers 改變 State ，若是是異步行爲（反作用）會先觸發 Effects 而後流向 Reducers 最終改變 State，
（3）因此在 dva 中，數據流向很是清晰簡明。

WEB前端學習交流羣21 598399936

QQ註冊登陸http://www.kgc.cn/index.php?tuin=7123 領取學習資料