Nuxt Fetch 运行 2 次（在服务器和客户端上）

【问题标题】：Nuxt Fetch run 2 times(on server and client)Nuxt Fetch 运行 2 次（在服务器和客户端上）
【发布时间】：2021-06-25 12:17:20
【问题描述】：

当我尝试在 Nuxt 中通过 fetch() 从服务器加载数据时，它会加载 2 次。
当页面加载数据呈现时，它会在几秒钟后再次在客户端上获取。

我在一个简单的“关于”页面中尝试了fetch()。

<template>
  <div id="app" class>
  </div>
</template>

<script>
export default {
  name: "App",
  async fetch() {
    console.log("fetching");
  }
};
</script>

它在日志中记录了 fetching 2 次。

【问题讨论】：

标签： vue.js nuxt.js

【解决方案1】：

由于 SSR 渲染不匹配，您确实有 2 个调用：

在生成期间完成一次后端调用
第二次调用已完成，因为客户端水合失败，因此已完成强制调用

您可以参考这个问题并在那里寻找解决方案（写我的）：Vuejs Error: The client-side rendered virtual DOM tree is not matching server-rendered

修复此错误后，它应该会再次正常工作。

【讨论】：

可以的。它只在我的另一个 nuxt 项目中获取 1 次。