带有 useSelector 和 useDispatch 的 Redux Hooks - 为什么要使用这个？

Question

我刚刚转换了一个 React 组件，该组件有一个单独的“容器”文件，其中包含 mapStateToProps / mapDispatchToProps 连接包装器实现。

现在我的 GUI 组件与 redux 特定函数（例如 useSelector 和 useDispatch）混合在一起。现在没有任何道具被传入。

这似乎是最糟糕的设计模式。在 GUI 组件之前，无论它们是来自 redux 还是来自父控件，都是 props 的函数。

易于测试，并且非常清楚组件所依赖的属性。

这一切都消失了！

有人能想到使用 redux hooks 的好处之一吗？也许我错过了一些东西。

谢谢

Answer 1

唯一的好处是你不必将这些道具从父母一直传递给孩子。说真的，这是“唯一”的好处。因此，如果它有效，请不要重构任何东西来使用钩子，除非你有充分的理由不这样做。

Answer 2

Hooks 的主要优点是可以编写自定义钩子。当它对你所做的事情没有意义时，优势就很小。

Answer 3

Redux Hooks 对 Typescript 有更多支持。尝试将

mapStateToProps
1. /

   mapDispatchToProps

   与 Typescript 一起使用可能是一场噩梦。通过 Typescript 使用钩子很容易。因此，如果您使用 Typescript，那么钩子将是更好的方法。Hooks 比
mapStateToProps
2. /

   mapDispatchToProps

   更简单。他们需要更少的代码。对于某些开发人员来说，它们的语法可能不太令人困惑。Redux hooks 的包尺寸要小得多。
3. 同时将继续支持映射到道具。
官方 Redux 最佳实践
4. 推荐 Redux Hooks 而不是 connect 函数。
用

mapStateToProps

能做的事 /

mapDispatchToProps

不能用 Redux Hooks 做，所以你应该使用更简单的 Hooks 推荐方法。