React-Redux
Redux 只是一种状态管理的解决方案
Store：数据仓库，保存数据的地方
State：是一个对象，数据仓库里的所有数据都放到一个state里面。
Action:1个动作，用来触发数据改变的方法。
Dispatch:将动作触发成方法。
Reduce：一个函数，通过获取动作， 改变数据，生成一个新的State，从而改变页面
安装
cnpm install redux --save
初始化数据
const store=createSore(reducer)
获取数据
let state = store.getState()
修改数据
store.dispacth({type:"add",content:{id:1,msg:"hello"}})
修改视图
store.subscribr(()=>{
ReactDom.render(
})
React-redux
安装
npm install react-redux -save
新概念：
Provider组件：自动将store里的state和组件进行关联，
MapStatetoProps:这个函数用于将store的state映射到组件的props
mapDispatchToProps：将store中的dispatch映射到组件的props里实现了方法的共享
connect方法：将组件和数据(方法)进行连接。
使用：
初始化数据：实例化store
function reducer(state={num:0},action){
switch(action.type){
case "add":
state.num++;
break;
default:
break;
}
return {...state}
}
const store = createStore(reducer)
获取数据：
//1.将state映射到props函数
function mapStateToprops(state){
return{
value:state.num
}
}
//2.将修改state数据的方法，映射到props,默认会传入store里的dispatch方法
function mapDispatchToProps(dispatch){
return{
onAddClick:()=>{
dispatch(addAction)
}
}
}
//将上面的这两个方法，将数据仓库的state和修改state的方法映射到组件上形成新的组件
const App = connect(
//注意顺序
mapStateToprops,
mapDispatchToProps,
)(Counter)
class Counter extends React.Component{
render(){
//计数，通过store的state传给props，直接通过props就可以将state的数据获取
const value = this.props.value;
console.log(value);
//将修改数据的事件或者方法传入到props
const onAddClick = this.props.onAddClick;
//等同于mapMutation mapState
return(
计数的数量：{value}
)
}
}