axios 和 useFetch (nuxt 3) 有什么区别？

Question

我慢慢开始从 nuxt 2 迁移到 nuxt 3。以前我曾经使用 axios。

在Nuxt3中，推荐使用useFetch

然而，useFetch 的行为非常奇怪。呼叫不是系统进行的。

例如在这段代码中：

async mounted() {
        const store = useAuth();
        let response = await axios.get('http://dev.test.fr/api/secured/admin', {headers : store.authHeader() });

        this.sensibleInformation  = response.data;
    },

使用 Axios，每次我打开此页面时，都会进行调用并且 sensibleInformation 是最新的。

使用useFetch，语法类似

    async mounted() {
        const store = useAuth();
        let response = await useFetch('http://dev.malt.fr/api/secured/admin' , {method : 'get', headers : store.authHeader() });
        this.sensibleInformation  = response.data;
    },

但有时对服务器的调用已经完成。因此，合理的信息大部分时间都是空的。而且我在文档中没有找到任何解释。

也许这里有我想念的东西。

我正在使用 nuxt 3.0.0-rc.6

Answer 1

对此不太确定，但我认为“useFetch”帮助器被设计为与 Vue 组合 API 一起使用，所以：

• 在“设置”功能中
• 如果您使用“<script setup>”合成器，则直接在脚本标记中

您正在处理的问题可能是由于您在 Vue.js 选项 API 的“mounted”挂钩中使用“useFetch”所致。

但再一次，不确定这个:)