请问下你们在开发React项目的时候，是使用的React-Query库进行网络请求，还是使用的axios呢？

Question

请问下：
1、你们在开发React项目的时候，是使用的React-Query库进行网络请求，还是使用的axios呢？
2、React-Query 和 axios有什么差异，是否使用了axios之后，不必再使用前者了？

Answer 1

React-Query 和 axios 应该是工作在不同的层级上,React-Query 是在更高的层级上工作,提供了数据缓存,重请求, ssr 兼容等功能。随着 node 原生支持和浏览器一致的 fetch API,现在的主流框架都直接使用 fetch 进行请求,如果是使用 axios,可以把 axios 的 adapter 设置 fetch。也就是 React-Query 包 axios, axios 包 fetch。具体要不要用主要看项目规模,如果项目没多少接口,随便把 fetch 封装一下就能用了。像 zustand 是客户端的状态管理库,而 React-Query 集中在 server-state 的管理,但是其本身功能是覆盖客户端的状态管理的,因为 queryFn 其实也可以直接写其他数据,不一定是请求回来的数据。React-Query 有一遍文章专门提到这个
https://tanstack.com/query/latest/docs/framework/react/guides...

Answer 2

While both React-Query and axios sever different purposes, using them combined makes you a 10x developer.

1. axios takes care of API/Network requests out of the box and makes it easy to handle request response
2. React-Query makes it easy to manage API request state (i.e. data, loading, error and more.)

Using them both really makes you fast paced develoeper and allows performance optimization by default

Answer 3

看个人习惯 axios 更加原始一些。 React-Query 功能更多。我个人倾向于 axios，我可以自己实现各式各样的拦截器。

React-Query 支持缓存和状态管理功能。当然 axios 也有额外的三方插件支持缓存之类的能力。

你根据你需要的能力选择适合自己的呗。

axios 我遇到过在 node 中请求异常丢失的问题，解决方案就是社区有个包用一下。
react-query 遇到过一个弱网请求丢失的问题，解决方案是修改一下判断逻辑。

React-Query：是一个用于 React 的查询库，它提供了缓存、同步状态、分页和重试等高级功能。React-Query不仅处理网络请求，还管理这些请求的状态（如加载中、成功、失败等），使得开发者可以更容易地在UI中展示这些状态。

axios：它是一个基于Promise的HTTP客户端，用于浏览器和node.js。axios提供了从浏览器中创建XHR请求和从node.js中创建http请求的能力。它支持请求和响应的拦截、转换请求和响应数据等特性。