Redux有点类似信号编程，只需关注信号的发射和监听
四个要素
1.Store
定义
存储数据的对象，一个应用只有一个store如何创建
import { createStore } from 'redux'
const store = createStore(fn)
2.State
定义
一个时间点对应一个快照，state与view相关联，state变化导致view变化如何获取
const state = store.getState();
3.Action
定义
View通过action来使state变化，View -(Action)->State如何创建
const action = {
type: 'ADD_INFO',//action的名称
data//action附加的信息
}
4.Reducer
- 定义
state变化的规则
四个步骤
- 定义reducer
- 创建store
- 订阅
- 触发action
Redux在React中的应用
1.前戏：设计一个文件夹目录
· redux
· actions
· store
· reducers
2.小试牛刀：state的展示与修改
3.正式实战：
3.1单个页面，共用一个redux
3.2多个页面，共用一个redux
Detail.jsx
import { connect } from 'react-redux'
import { bindActionCreators } from 'redux'
import * as userinfoActions from '../../redux/actions/userinfo'
// 任何时候，只要 Redux store 发生改变，mapStateToProps 函数就会被调用
function mapStateToProps(state) {
return {
haha: state.userinfo
}
}
function mapDispatchToProps(dispatch) {
return {
userinfoActions: bindActionCreators(userinfoActions, dispatch)
}
}
export default connect(
mapStateToProps,
mapDispatchToProps
)(Detail);
//this.props.haha.userid以及this.props.haha.city就可以拿到了
