models

一. 參考網站

redux:  http://cn.redux.js.org/docs/introduction/CoreConcepts.html

dva:  https://github.com/dvajs/dva/blob/master/docs/Concepts_zh-CN.md

connect： http://taobaofed.org/blog/2016/08/18/react-redux-connect/

 

二. 概念

1.全部的state都以一個對象樹的形式儲存在store中。

2.惟一改變state的方法是觸發action（一個描述發生什麼的對象）。

3.爲了描述action如何改變state樹，須要編寫reducers（一個接收state和action，並返回新的state的函數）。

reducers: {

    changeLoginStatus(state, { payload }) {

      return {  

        ...state,

        status: payload.status,

        type: payload.type,

        submitting: false,

      };

    },

 }

4.經過store.dispatch()將action傳到store。(用於頁面上交互時，事件裏面)

this.props.dispatch({

    type: 'login/login',

    payload: {}, // 須要傳遞的信息

}）

5. action 是改變 State 的惟一途徑，可是它只描述了一個行爲，而 dipatch 能夠看做是觸發這個行爲的方式，而 Reducer 則是描述如何改變數據的。

6.connect作了兩件事，一是把組件裏的屬性（糧食）送到罐子裏去，二是把組件們須要幹什麼事情提早和罐子外面的redux約定好。

 

三. models裏包含下面這幾部分

1.effects

effects: {

    *login({ payload }, { call, put }) {

      yield put({

        type: 'changeSubmitting',

        payload: true,

      });

      const response = yield call (fakeAccountLogin, payload);

      yield put({

        type: 'changeLoginStatus',

        payload: response,

      });

      // Login successfully

      if (response.status === 'ok') {

        console.log(routerRedux);

        yield put(routerRedux.push('/'));

      }

    },

};