redux

redux真的太麻烦了。。

弄了一堆依赖，用来用去很晕

但是领导让用就得用。。

 

所需依赖

redux

react-redux

redux-thunk

安装命令   npm i redux react-redux redux-thunk

 

抽离redux成为独立文件（文件结构）

--src

    --store

       --reducer              ----reducer文件夹

           --index.js            ----reducer的主文件

           --partReducer.jsf      ----reducer的分支文件，可有多个

           -- ......

      --actionf               ----action文件夹

          --type.js               ----标识action的动作来源

         --partAction.js        ----dispatch的action

         -- ......               ----多个state数据可对应多个action

      --store.js               ----主文件，store数据

 

调用方法

	来自	作用	参数
Provider	react-redux	包裹根组件，连接store
createStore	redux	创建stroe，传递参数	createStore （reducer，state，middleware）
thunk	redux-thunk	中间件，异步执行数组，分发action
combineReducer	redux	将reducer分支数据合成根reducer，供view调用
connect	react-redux	当前组件和action之间的连接，export时调用	connect(根reducer数据,{ action})(组件名)
type	type.js	reducer中action触发state变化时标识action的动作来源
mapStateToProps		获取reducer返回的数据
compose	redux	做redux浏览器的调试适配	window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()

 

注意

尽量使用es6语法

注意模块的导出和引入

 

Tips

腾讯课堂的米斯特吴有redux的视频比较完整但是感觉入手困难，需要完整看一遍，然后再跟着敲一边，勉强理解。传送门