redux

React Store:提供的方法{ store . dispatch () store . subscribe (() => { this . forceUpdate (); // this.setState({}); }); store . getState () } // import { createStore, applyMiddleware } from "redux"; import { createStore , applyMiddleware } from "../kredux" ; // import thunk from "redux-thunk"; // import logger from "redux-logger"; // 初始话，状态的修改 function counterReducer ( state = 0 , action ) { console . log ( "state" , state ); switch ( action . type ) { case "add" : return state + 1 ; case "minus" : return state - 1 ; default : return state ; } } // const store = createStore(counterReducer,

　　Redux的中间件（Middleware）遵循了即插即用的设计思想，出现在Action到达Reducer之前（如图10所示）的位置。中间件是一个固定模式的独立函数，当把多个中间件像管道那样串联在一起时，前一个中间件不但能将其输出传给下一个中间件作为输入，还能中断整条管道。在引入中间件后，既能扩展Redux的功能，也能增强dispatch()函数，适应不同的业务需求，例如通过中间件记录日志、报告奔溃或处理异步请求等。 图10 中间件管道 一、开发模式 　　在设计中间件函数时，会遵循一个固定的模式，如下代码所示，使用了柯里化、高阶函数等函数式编程中的概念。 function middleware(store) { return function(next) { return function(action) { return next(action); }; }; } 　　middleware()函数接收一个Store实例，返回值是一个接收next参数的函数。其中next也是一个函数，用来将控制权转移给下一个中间件，从而实现了中间件之间的串联，它会返回一个处理Action对象的函数。由于闭包的作用，在这最内层的函数中，依然能调用外层的对象和函数，例如访问action所携带的数据、执行store中的dispatch()或getState()方法等。示例中的middleware(

redux中间件概念 比较容易理解。 在使用redux时，改变store state的一个固定套路是调用store.dispatch(action)方法，将action送到reducer中。 所谓中间件，就是在 dispatch发送action 和 action到达reducer 之间，加入一些中间层，对action进行处理。 在之前学习redux的异步操作时，用到的redux-thunk就是一个中间件。action抵达reducer之前先对其进行判断，如果是对象就直接送到reducer；如果是函数就执行。 中间件特点： 1.是一个独立的函数，与其他中间件没有依赖关系 2.中间件可以有多个，按顺序组合使用 3.有统一的接口 中间件说白了就是一些第三方的插件，用来增强dispatch的功能，让我们可以在action到达reducer之前对action作出判断、改造、log下信息、实现复杂逻辑等。 当我们使用了多个中间件时，action依次从前一个中间件传到下一个中间件，最后抵达reducer。也可能在某个中间件进行处理后，发现没必要传到reducer了，就不传给下一个中间件（相当于丢弃，不再去处理）。 中间件必须定义为一个函数，它的基本结构如下： 1 function middleWare({dispatch,getState}){ 2 return function(next){