1

enter image description here

When I try to load data from server via fetch() in Nuxt it loads 2 times.
When page load data render and after some second it fetches again on the client.

I tried fetch() in a simple About page.

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

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

It log fetching 2 times in log.

kissu
  • 40,416
  • 14
  • 65
  • 133
mukeshsoni
  • 483
  • 8
  • 29

1 Answers1

3

You do have 2 calls because of your missmatched SSR render:

  • one call on the backend is done during the generation
  • second call is done because the client side hydration failed, hence a forced one is done

You can refer to this question and look for a solution there (wrote mine): Vuejs Error: The client-side rendered virtual DOM tree is not matching server-rendered

Once this error is fixed, it should be working great again.

kissu
  • 40,416
  • 14
  • 65
  • 133