本文视频地址：https://www.qiuzhi99.com/movies/react-redux/150.html
参考链接
https://github.com/reactjs/react-redux
https://github.com/reactjs/react-redux/blob/master/docs/api.md
目录结构
image.png
- actions定义action事件
- constants定义常量
- reducers定义处理的逻辑（传入旧的state和action返回新的state）
代码
index.js
import {createStore} from 'redux';
import reducer from './reducers/counter';
import {increment,decrement} from './actions’;
import {Provider} from 'react-redux’;
const store = createStore(reducer);
ReactDOM.render(
<Provider store={store}>
<App />
</Provider>
, document.getElementById('root'));
App.js
//Store传值的实现
import {connect} from 'react-redux’;
const mapStateToProps = (state) => {
console.log(state);
return {
counter: state
};
};
export default connect(mapStateToProps)(App);
- index.js没有了事件的绑定和触发
- 添加了Provider
- 添加了connect
- 添加了mapStateToProps
