如何将数据传递给组件？

Question

警告：您可能有拼写中风

嘿！我有一个非常简单的问题（也许）：我应该如何将数据传递给我的组件？ 现在我只能看到 2 个解决方案：props（从 App 到我的组件）和 redux（mapStateToProps、mapDispatchToProps）（让我们暂时跳过 ContextAPI）

---

案例 #1（道具（从应用程序到我的组件））

例如，我的网站上有一个商品清单。然后我的列表必须接收数据才能呈现它。我应该通过 App、Main、SomeWrapper、SomeOtherWrapper、GoodsList（例如）传递它，不要犯错误，然后才呈现所有商品。现在，让我们假设我需要将 onCLick 添加到 GoodsItem => 我需要通过所有组件传递 onGoodsItemClick，修复所有测试（因为 PropTypes 会发出警告）和 PropTypes。有点复杂，例行公事，技术含量不高，不是吗？

案例 2（redux（仅通过 mapStateToProps、mapDispatchToProps 传递需求道具））

好的，让我们看看第二种情况：排序组件。我已经为我的组件编写了连接函数。它们看起来像这样：

const mapStateToProps = (state, ownProps) => ({
  ...ownProps,
  sortType: state.sortType,
  allOffers: state.allOffers // allOffers imports only for mapDispatchToProps
});

const mapDispatchToProps = (dispatch) => ({
  onSortChange: (allOffers, sortType) => {
    dispatch(ActionCreator.changeSortType(sortType));
    dispatch(ActionCreator.sortOffers(allOffers, sortType)); // allOffers is using only here
  }
});

在这里，我必须接收 allOffers 才能将它提供给 mapDispatchToProps 以用于排序功能（可能是错误在这里。据我所知，ActionCreator 无法访问存储，只能使用 args）。为什么我要接收数据，甚至不会在页面上呈现？

React 开发者在这种情况下会怎么做？只使用一种方法？在不同的情况下使用两者？将这两种方法与修订结合起来？使用第三种方法？