乐趣区

react-redux简单学习(四)

react-redux

安装 yarn add react-redux
<Provider/> 组件的使用

import React, {Component} from ‘react’;
import Header from ‘./common/header/index’;
import {Provider} from ‘react-redux’;
import store from ‘./store’

class App extends Component {
render() {
return (
<Provider store = {store}>
<Header></Header>
</Provider>
);
}
};
export default App;
组件中如何获取及使用 store,获取用 mapStateToProps,使用的话把 state 换成 props
import {connect} from “react-redux”;
const mapStateToProps = (state) => {
return {
focuse:state.focuse,
list:state.list
}
};
const mapDispatchToProps = (dispatch) => {
return {
changeFocuse () {
store.dispatch(changeFocuse())
},
changeBlue () {
store.dispatch(changeBlur())
}
}
}

export default connect(mapStateToProps,mapDispatchToProps)(Header) ;

退出移动版