React + Redux：商店更新時如何更新狀態

Question

很抱歉這個菜鳥問題，但是嘗試學習React + Redux和我正在使用的書有一些概述性的內容，但是沒有關於“將它們全部綁在一起”的說明。

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

您會看到，我有幾種顏色的初始狀態，其中包括一些減速器和動作創建器。

我的問題基本上是， 商店更新時如何更新控件/狀態？

看第49行，我從商店設置了初始狀態。 然后，在第51到第54行中，我訂閱商店更改，並在其中調用this.setState並獲取商店的新狀態。 同樣在第71行，我通過將colors分配給狀態來設置colors常量。

這是最好/正確的方法嗎？ 或者，還有更好的方法？ 最好是更新狀態，然后更新顏色（例如我當前正在執行的操作）嗎？ 還是應該通過subscribe功能以某種方式更新顏色？

感謝您的見解/指導。

Answer 1

因此，您可以通過這種方式工作，但是通常無論從存儲中拉出的任何內容都不會進入組件的state -存儲的目的是避免首先保持該狀態。

因此，下一步將是添加react-redux （ https://www.npmjs.com/package/react-redux ）作為依賴項，並使用connect函數將狀態從存儲中拉出並將其提供給組件通過道具：

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的視頻，它專門介紹了其中的一些內容，實在太多了，無法在此處發布