redux分成了action、reducer、store三个部分。
我们首先,定义action函数,action函数中返回一个对象,包括type和相关的数据;
然后,我们定义reducer,reducer可以分成多个,然后处理不同的action,返回一个新的state
最后,我们定义store,store的值由reducer来确定,最终反馈到UI上
整个流程就是:
action => reducer => store => 组件的props
使用:
1、首先,将根组件放入<Provider>中
2、哪个组件需要使用时,定义一个绑定方法,将store中的值绑定到当前组件的props,如下:
function select(store) {
return {
page: store.switchTabStore.page,
}
}
然后,导出的时候,使用connect,如下:
export default connect(select)(Index);
3、第二步只是将store的值绑定到组件,但是我们如何修改store中的值呢?通过dispatch一个action,如下:
tabSelect(el) {
this.props.dispatch(switchTab(el.props.name));
}
4、redux-thunk主要是为了处理异步请求使用
5、在使用redux的组件中,都需要使用到connect;如果没有接收参数,可以如下:
export default connect()(Match);
redux理解,下面一篇知乎说的很好