关于mapStateToProps和mapDispatchToProps

理解:从store中获取信息上升到props中,这样就有两种props,一种是组件本身的,一种是从store中获取的。

参考

mapStateToProps(state,ownProps)

mapStateToProps是一个函数,用于建立组件跟storestate的映射关系,作为一个函数,它可以传入两个参数,结果一定要返回一个object

传入mapStateToProps之后,会订阅store的状态改变,在每次storestate发生变化的时候,都会被调用。

ownProps代表组件本身的props,如果写了第二个参数ownProps,那么当prop发生变化的时候,mapStateToProps也会被调用。例如,当 props接收到来自父组件一个小小的改动,那么你所使用的 ownProps参数,mapStateToProps 都会被重新计算

mapStateToProps可以不传,如果不传,组件不会监听store的变化,也就是说store的更新不会引起UI的更新

example:

const mapStateToProps = (state) => {
return {
todoList: state.todoList
}
}

传入了props的:

const mapStateToProps = (state, ownProps) => {
return {
active: ownProps.filter === state.visibilityFilter
}
}

mapDispatchToProps

mapDispatchToProps用于建立组件跟store.dispatch的映射关系

可以是一个object,也可以传入函数

如果mapDispatchToProps是一个函数,它可以传入dispatch,ownProps, 定义UI组件如何发出action,实际上就是要调用dispatch这个方法