组件文件中的 mapStateToProps 有意义吗？

Question

我正在学习 Redux，到目前为止我发现它真的非常令人困惑。

到目前为止，在我看过的所有教程中， mapStateToProps函数都包含在组件文件本身中，例如（如果是代码片段，我删除了不相关的部分）：

import React from 'react';
import { connect } from 'react-redux';

import CartItem from '../cart-item/cart-item.component';

const CartDropdown = ({ cartItems }) => (
  <div>
      {cartItems.map(cartItem => (
        <CartItem key={cartItem.id} item={cartItem} />
      ))}
  </div>
);

const mapStateToProps = ({ cart: { cartItems } }) => ({
  cartItems
});

export default connect(mapStateToProps)(CartDropdown);

我不明白将mapStateToProps放在组件文件中mapStateToProps意义，因为它使我的组件依赖于 Redux 状态。 如果我们只使用 Redux 状态，为什么要把它传递给 props 这么麻烦？

奖金评论：我不会撒谎，到目前为止，Redux 让我有点头疼。 我不明白为什么样板文件这么大。 添加任何新的 Redux 状态属性看起来很麻烦。 一般只在大型应用程序中有意义吗？ 为大多数简单任务提供操作、减速器、调度器、映射器、存储和提供程序的想法很困难。

Answer 1

或许你应该明白 redux 的目的，你一开始为什么要使用 redux。 默认情况下，ReactJS 为您提供 React 钩子或setState来管理状态，这在组件级别上效果很好，但是一旦您的应用程序增长，很可能需要多个组件来访问相同的状态。

仅仅因为上面的问题，你有很多选择来解决这个问题。 Redux、React 上下文、Mobx。 所有这些都被归类为状态管理库。 当然，它们都有其优点和缺点，我不是在这里推向任何一个库，您可以轻松地谷歌搜索以查看它们之间的比较并根据您的用例进行选择。

现在回到你的问题，如果mapStateToProps有意义，它完全是，抽象掉所有的复杂性，组件如何接收外部数据？ 只能通过props