Redux
状态管理
const { createStore } = require('redux')
const defailState = {

count: 0;

}
const reducer = function(state = defailState,action){

xxx>>>自己调用的
接收一个状态，返回一个新的状态，原状态是对象，新状态也要是对象

}

const store = createStore(reducer,action,xxx)--创建的时候会被执行一次reducer

const newState = store.getState()-获取最新状态-每次调用的时候也会执行reducer
store.dispatch({ ---派发的是action参数

xxx: xxx

})---每次调用时也会执行一次reducer
订阅你的改变信息提醒---store.subsrcibe(()=>{

xxxx

})

yarn add react-redux context--注入包
import { Provider } from 'react-redux'
ReactDom.render(

<Provider store="store">
    <Redux></Redux>
</Provider>

, document.xxxid('#root'))

Redux.js中
import { connect } from 'react-redux'
i
const mapStateToProps = (state) => {

return{
    count:state.count
}

}
const mapDispathToProps = (dispath) => {

return{
    incment(){
        dispath({
            type: xxx,
            payload:xxx,
        })
    },
    decment(){
        dispath({
            type: xxx,
            payload:xxx,
        })
    }
}

}
export defalut
connect(mapStateToProps,mapDispathTopProps)(Redux)
connect(fn1,fn2),接收两个函数
fn1:绑定state中的值，返回对象
fn2:绑定dispath函数，派发扁平对象，返回对象

什么纯函数
给定预期的输入，返回预期的输出
什么不是纯函数
给一个输入，不确定输出的结果！

副作用
想做异步请求，Action派发之前，需要中间件拦截：第三方工具--xxxxxx很多
redux-thuck
import {applyMiddleware} from 'redux' ---中间件可以让dispatch接受函数
import Thunk from 'redux-thuck'
const store = createStore(reducer,applyMiddleware(Tunck))
增强dispath，可以接收函数或对象或数组了
在componentDidMount(){}中可以调用props中定义的方法
UI组件思想
ReduxUI 纯DOM模板:定义函数式组件，返回UI 注意接收传入的参数props,如果是传函数
<ReduxUI {{
..this.props,

handleclick = {this.handleclick.bind(this)},
xxx

}}></ReduxUI>

ActionCreator !抽离函数
ActionCreator.js
export const loadData = ()=>{

return (dispath) = > {
    dispath({扁平对象})
}

}
在Redux中结构的引入
action-types
export const INDEX = 'x/index'
combineReducers() 合并
reducer只接受同步函数