redux todomvc：无法理解 `mapStateToProps`

Question

调查redux todomvc, still confused by connect and mapStateToProps。

todomvc/src/containers/App.js中的部分代码为：

const mapStateToProps = state => ({
  todos: state.todos
})

state 是 Redux 商店中的状态。但是我很困惑state有一个todos属性，这是一个数组。 todos 是减速器，是函数 here and here. Cannot understand what mapStateToProps does here still after reading https://github.com/reactjs/react-redux/blob/master/docs/api.md.

欢迎任何意见。谢谢

Answer 1

使用 redux，您的应用程序状态一起存在于一个对象中，称为状态。当你创建一个新的 reducer 时，你需要将它包含在 combineReducers 助手中。您可以在 file 中看到这种情况。您用于每个 reducer 的键的名称实际上最终在状态中是相同的名称。在这种情况下，它是待办事项。如果您为用户创建了一个新的减速器并将其作为 users 包含在 combineReducers 帮助程序中，它将作为 state.users.

提供。

Answer 2

我试试看。我希望我足够简洁。

如您所见，"state" 被传递给 "mapStateToProps"。这是什么，是一个包含您的减速器的对象 - 每个减速器的 "stores" 或 "states"。

例如，如果您发布的第二个示例看起来像这样。

import { combineReducers } from 'redux'
import todos from './todos'
import products from './products'

const rootReducer = combineReducers({
  todos,
  products
})

export default rootReducer

您现在处于 "products" 状态。所以传递给 mapStateToProps 的 'state' 对象看起来像这样

state = {
  todos,
  products
}

因为 "combineReducers" 函数 "combines" 你所有的减速器并且基本上在 "state/store" - 主要应用程序商店下创建密钥。请记住，redux 为您的全局状态创建了一个真实来源的想法。因此，通过组合 Reducers，我们将这些新的状态对象作为键放置在您的 "global state" 中……也就是说，如果您有多个 reducer。通常情况下，您只会拥有一个。很多时候，您可能不想要 "all of your state"，也许只是一片。

所以，你的组件，假设我们做到了。

const mapStateToProps = state => ({
  todos: state.todos,
  products: state.products
})

您的组件现在可以访问以下内容：

this.props.todos
this.props.products

mapStateToProps 所做的就是通过将这些值映射到您的组件，方便您访问此 "global" store/state 到您的组件。基本上，它会吞噬你的组件，添加道具，然后将它吐出来改变......用你的新值。

redux todomvc：无法理解 `mapStateToProps`

redux todomvc: cannot understand `mapStateToProps`

javascript

reactjs

redux

react-redux