反应查询和选择器和架构

Question

我正在从一个新应用程序 (redux/sagas/selectors) 中删除一些非常复杂的全局状态，以便 -> 上下文 api 和反应查询。这个“全局状态”中集成了大量选择器，现在需要重构。我只放了一些，将它们与生成所需数据的突变放在一起。但是——

你在 react-query 中使用“选择器”的策略是什么？

您将这些选择器放在何处，是在组件文件夹中还是在“选择器”文件夹中，或者位于派生数据的 react-query useQuery 中？

所以，为了清楚起见，我正在使用新的反应查询选择器功能。我的遗留应用程序在全球范围内和适当的组件中都有选择器，我不确定这是最清晰的方式..另外，特别是如果我有一个 useQuery 包装器在全球范围内......只是想在这里整理架构。

感谢任何帮助。

注意：我想我们可以有一个具有该功能的“选择器”文件（位于同一位置），但是我们是否可以导入我拥有的 useQuery 挂钩并在那里执行它.. 在“selectors.ts" 文件在其使用的功能文件夹中......或将选择器移动到 useQuery 包装器挂钩文件中。

策略？

Answer 1

我个人尝试尽可能少地保留全局内容——主要是在某个功能中共同定位的内容。如果某些东西真的需要在应用程序的任何地方都可以访问，它很可能是它自己的功能。如果有一个查询需要在多个功能中使用，我确实有一个顶级 queries 目录，但那里真的没有多少。

至于选择器：我将它们内联到 useQuery 钩子中，如果我不止一次需要它们，我将它们提取到一个函数中，如果它失控了，我将它们放在一个单独的文件中查询，例如：

- features
  - todos
    - queries.ts
    - selectors.ts

Kent C. Dodds 推荐的东西没什么特别的:) https://kentcdodds.com/blog/colocation

react-query and selectors and architecture