react-05

# 0. redux要點react

    1. redux理解redux

    2. redux相關APIapp

    3. redux核心概念(3個)異步

    4. redux工做流程ide

    5. 使用redux及相關庫編碼函數

 

#1. redux理解ui

    什麼?: redux是專門作狀態管理的獨立第3方庫, 不是react插件編碼

    做用?: 對應用中狀態進行集中式的管理(寫/讀)spa

    開發: 與react-redux, redux-thunk等插件配合使用插件

 

# 2. redux相關API

    redux中包含: createStore(), applyMiddleware(), combineReducers()

    store對象: getState(), dispatch(), subscribe()

    react-redux: <Provider>, connect()()

 

# 3. redux核心概念(3個)

    action:

        默認是對象(同步action), {type: 'xxx', data: value}, 須要經過對應的actionCreator產生,

        它的值也能夠是函數(異步action), 須要引入redux-thunk才能夠

    reducer

        根據老的state和指定的action, 返回一個新的state

        不能修改老的state

    store

        redux最核心的管理對象

        內部管理着: state和reducer

        提供方法: getState(), dispatch(action), subscribe(listener)

 

# 4. redux工做流程

![](http://www.ruanyifeng.com/blogimg/asset/2016/bg2016091802.jpg)

![](https://i.imgur.com/2R5G8bG.png)

        

# 5. 使用redux及相關庫編碼

    須要引入的庫:

        redux

        react-redux

        redux-thunk

        redux-devtools-extension(這個只在開發時須要)

    redux文件夾:

        action-types.js

        actions.js

        reducers.js

        store.js

    組件分2類:

        ui組件(components): 不使用redux相關PAI

        容器組件(containers): 使用redux相關API

相關文章
相關標籤/搜索
本站公眾號
   歡迎關注本站公眾號,獲取更多信息