您的位置:首页 > Web前端 > React

react-redux基础

2017-07-29 11:22 375 查看
文章结合一个官方示例理解更简单地址:https://github.com/GuoMouMo/ReduxSummary

首先redux有哪些基本的知识:store、state、action、reducer。

1、 store中含有哪些属性

     store:Object{
           dispatch:function dispatch(action) 
getState:function getState()
replaceReducer:function replaceReducer(nextReducer)
subscript:subscribe(listener)
Symbol(observable):function observable()
}

     以上属性功能不多解释

2、 state的获取及含有什么属性

     state = store.getState();  //获取state

     state:Object{
         //state的属性就是reducer中的属性。reducer是一种根据action产生新state的属性方法  
}

3、 action是什么,怎么产生,一般怎么使用

     action是一种描述事件的对象。一般action如下

     action:{
   type: "THING",    //描述什么事件
text              //描述事件中产生的后果
}

     一般通过自定义的方法产生action,如todo(text){
                                       return {
           type: "TING",
       text
       }
  }

    一般这样使用store.dispatch(todo(text))

4、 reducer是什么,有什么用

     reducer是根据action产生新的state的一种方法,接受两个参数 (老的state,action)。

     当store.dispatch(action)接受新的action时自动调用reducer,

     第一次使用时是在创建store时,store = createStore(reducer)

总结、1、只有一个store,包含所有时段的数据,通过createStore(reducer)创建

           2、state通过store.getState()获得,一个view对应一个state 

           3、Action view改变通过Action获得新的state;Action的格式一般为{

                                                             type:"ADD",   //标识

           payload:"learnRedux"   //行为

      }

           4、store.dispatch(Action) View通过此方法发送Action;

           5、Reducer 接受Action和state Reducer(state,Action){

                                                     switch(action.type){         //通过行为产生新的state

            return new_state;

                                                     }

      }

           6、通过store = createStore(reducer)创建一个store,当通过store.dispatch传进来一个action就会自动调用reducer()生成一个新的state;

           7、store.subscript() 监听state的变化,当state改变时触发。store.subscript返回一个函数,当调用这个函数是即可解除监听,有点像定
 时器。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  react redux web前端