Redux React-redux 理解

Redux 相似於一個state  數據樹，將全部的 數據存儲到這個 store 上.

　　reducer / action  其中 reducer 存儲的數據，action 是出發的動做，惟一一個修改 reducer 的，其中內部的 subscrible 是一個監聽。

 

// react -redux 使用方法

react-redux 提供了connect 方法;

　　import { connect } from 'react-redux';

　　const mapStateToProps = (state) => ({ list: state.list });

　　const mapDispatchToProps = (dispatch) => ({ getTodoList: () => dispatch(TodoList.getTodoList()) })

　　import default connect({ mapStateToProps, mapDispatchToProsp })(TodoList);

 

// dva 封裝數據 封裝 react、react-redux、

　　import { queryBasicProfile, queryAdvancedProfile } from '../services/api';

　　export default  {
　　　　namespace: 'profile',      

　　　　state: {                           //  保存數值
　　　　　　basicGoods: [],
　　　　},

　　　　effects: {                      // action  觸發的的動做
　　　　　　*fetchBasic(_, { call, put, select }) {
　　　　　　　　yield put({

　　　　　　　　　　 type: 'changeLoading',  

　　　　　　　　　　payload: { basicLoading: true },
　　　　　　　　});
　　　　　　　　const response = yield call(queryBasicProfile);
　　　　　　　　yield put({
　　　　　　　　　　type: 'show',
　　　　　　　　　　payload: response,
　　　　　　　　});
　　　　　　},
　　　　},

　　　　reducers: {     //  保存數值
　　　　　　show:  (state, { payload })  => ({

　　　　　　　　...state,

　　　　　　　　...payload,

　　　　　　 })  　　　　},　　};