javascript - react + 终极版 : How to update state when store is updated

Question

抱歉这个菜鸟问题，但是尝试学习 React + Redux 和我正在使用的书有一些概述的内容，但没有关于“将它们全部捆绑在一起”的指导。

看看:https://stackblitz.com/edit/react-chapt8-redux-store?file=index.js

你会看到我有一个颜色的初始状态，有几个 reducer 和 action creator。

我的问题基本上是，如何在我的商店更新时更新控件/状态？

查看第 49 行，我从商店设置了初始状态；然后，在第 51 行到第 54 行，我订阅了我调用 this.setState 的商店更改并获取我的商店的新状态。同样在第 71 行，我通过将其分配给状态来设置 colors 常量。

这是最好/正确的方法吗？或者，还有更好的方法？最好是更新状态，然后更新颜色(就像我目前正在做的那样)？或者，我应该通过 subscribe 函数以某种方式更新颜色吗？

感谢您的见解/指导。

Answer 1

所以你的方法是可行的，但通常无论你从商店中取出什么，都不会进入组件的 state - 商店的目的是避免将该状态保留在第一名。

因此下一步将是添加 react-redux ( https://www.npmjs.com/package/react-redux ) 作为依赖项，并使用 connect 函数将状态从存储中拉出并通过 Prop 将其提供给组件:

import { connect } from 'react-redux';

class App extends Component {
    ... code for <App/> component
}

function mapStateToProps(state) {
    ... code to pick out only the relevant state from the props
}

connect(mapStateToProps)(App);

我强烈推荐 Stephen Grider 在 udemy 上的视频，它专门介绍了其中的一些内容，在这里发布的内容太多了