TanStack Query 是否取代 Redux、MobX 或其他全局状态管理器？

好的，让我们从几个重要的项目开始

• TanStack Query 是一个 服务器状态 库，负责管理服务器和客户端之间的异步操作
• Redux、MobX、Zustand 等是 客户端状态 库，可以用来存储异步数据，尽管与像 TanStack Query 这样的工具相比效率较低

考虑到这些点，简短的答案是 TanStack Query 取代了用于管理客户端状态中的缓存数据的样板代码和相关连接代码，并用几行代码取而代之。

对于绝大多数应用程序来说，在将所有异步代码迁移到 TanStack Query 后，剩下的真正全局可访问的客户端状态通常非常小。

在某些情况下，应用程序可能确实有大量的同步的仅客户端状态（例如视觉设计师或音乐制作应用程序），在这种情况下，您可能仍然需要一个客户端状态管理器。在这种情况下，重要的是要注意 TanStack Query 不是本地/客户端状态管理的替代品。但是，您可以将 TanStack Query 与大多数客户端状态管理器一起使用，而不会出现任何问题。

这里我们有一些由全局状态库管理的“全局”状态

const globalState = {
  projects,
  teams,
  tasks,
  users,
  themeMode,
  sidebarStatus,
}

const globalState = {
  projects,
  teams,
  tasks,
  users,
  themeMode,
  sidebarStatus,
}

目前，全局状态管理器正在缓存 4 种类型的服务器状态：项目、团队、任务和 用户。 如果我们将这些服务器状态资产迁移到 TanStack Query，我们剩余的全局状态将更像这样

const globalState = {
  themeMode,
  sidebarStatus,
}

const globalState = {
  themeMode,
  sidebarStatus,
}

这也意味着，通过对 useQuery 和 useMutation 进行一些 hook 调用，我们还可以删除用于管理服务器状态的任何样板代码，例如

• 连接器
• Action Creators
• 中间件
• Reducers
• 加载/错误/结果状态
• 上下文

删除了所有这些东西之后，您可能会问自己，“为了这微小的全局状态，继续使用我们的客户端状态管理器值得吗？”

这取决于您！

但 TanStack Query 的作用很明确。它从您的应用程序中删除异步连接代码和样板代码，并用几行代码取而代之。

还在等什么，快去试试吧！