react之redux

1.安装npm install --save redux react-redux

  function counter(state, action) {
        if (typeof state === 'undefined') {
          return 0
        }
        switch (action.type) {
          case 'ADD'://根据动作更改state
            return state + action.payload
          case 'MNIUS':
            return state - 1
          default:
            return state
        }
      }
      var store = Redux.createStore(counter）
      store.dispatch({type:'ADD'})//触发一个动作

	//一步操作不要放在store中，放在外面的函数
      store.dispatch({type:'ADD',payload:45})
	if(store.getState()%2==0){
      setTimeout(()=>{
        store.dispatch({type:'ADD',payload:45})
      },2000)
      
    }

1.创建一个store,store接受一个函数，函数两个参数。agr1：先前的状态，arg2：触发状态变化的动作；return 返回新的状态
维持应用的 state；
提供 getState() 方法获取 state；//前一个state
提供 dispatch(action) 方法更新 state；
通过 subscribe(listener) 注册监听器;
通过 subscribe(listener) 返回的函数注销监听器。

react-readux readux插件随时随地可以访问到store不必在一层层的传store
npm install --save react-redux
doc:https://react-redux.js.org/

index.jsx

ReactDOM.render(
    <Provider store={store}>//provider内的组件都可以接受到store
      <App />
    </Provider>
  , document.getElementById('root'));

app.js

function mapStateToProps(state){
  return {
    n:state.n
  }
}
const mapDispatchToProps={
  add1(){
    console.log('add1')
    return {type:'ADD',payload:56}
  },

}


export default connect(getPartialStore,actionCreator)(App);

代码：https://github.com/wangliuyong/react-redux-demo/tree/master/src