redux 笔记

2019-02-27  本文已影响0人  程一刀

1.发起 action
2.通过reducer ,产生新的state,combineReducers 用来合成
3.Store:Store 就是把它们联系到一起的对象* 维持应用的 state;

import { createStore } from 'redux'
import todoApp from './reducers'
let store = createStore(todoApp)

4.容器组件
4.1使用 connect() 前,需要先定义 mapStateToProps 这个函数来指定如何把当前 Redux store state 映射到展示组件的 props 中
4.2定义 mapDispatchToProps()方法注入action
4.3生成容器组件

import { connect } from 'react-redux'

const VisibleTodoList = connect(
  mapStateToProps,
  mapDispatchToProps
)(TodoList)

export default VisibleTodoList

5.异步action
通过使用指定的 middleware,action 创建函数除了返回 action 对象外还可以返回函数
我们使用了 applyMiddleware() 在dispatch 机制中引入 Redux Thunk middleware
默认情况下,createStore() 所创建的 Redux store 没有使用 middleware,所以只支持 同步数据流
你可以使用 applyMiddleware() 来增强 createStore()。虽然这不是必须的,但是它可以帮助你用简便的方式来描述异步的 action

import { createStore, applyMiddleware } from 'redux';
import thunk from 'redux-thunk';
import rootReducer from '../reducers/rootReducer';

let createStoreWithMiddleware = applyMiddleware(thunk)(createStore);
let store = createStoreWithMiddleware(rootReducer);
// let state = store.getState();
// alert(state.Search.searchText)
export default store;

链接:http://cn.redux.js.org

上一篇 下一篇

猜你喜欢

热点阅读