React - Redux实践

2017-09-15  本文已影响0人  守心向暖
Redux是javascript的状态容器,能提供可预测化的状态管理。提出以下两点:
- web应用是一个状态机,视图与状态是一一对应的。
- 所有的状态,保存在一个对象里面。

Redux的状态容器Store存储着所有的状态数据,每个状态都与视图一一对应。一个State对应一个View,State存储在Store中。

View: 操作入口,向Action发出State即将变化的通知。
ActionCreator:接收View发出的通知,生成对应的Action,并将Action分发[dispatch(action)]给Store。
Store:接收到Action以后将[(prevState, action)]给Reducer,通过Reducer计算后将新的状态通知View更新。
Reducer:通过从Store获取的先前State计算获得新的State,回馈给Store。

整个流程中,数据的流动是单向的,保证了流程的清晰。

{ Provider, createProvider, connectAdvanced, connect } in react-redux
{ MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, matchPath, withRouter } in react-router
{ BrowserRouter, HashRouter, Link, MemoryRouter, NavLink, Prompt, Redirect, Route, Router, StaticRouter, Switch, matchPath, withRouter } in react-router-dom
{ ConnectedRouter, routerMiddleware } in react-router-redux
{ createStore, combineReducers, bindActionCreators, applyMiddleware, compose } in redux
{ historyAPI, push, replace, setState, go, goBack, goForward } in redux-router
{ routerStateReducer, ReduxRouter, reduxReactRouter, isActive, historyAPI, pushState, replaceState, setState, go, goBack, goForward } in redux-react-router
上一篇下一篇

猜你喜欢

热点阅读