Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

edge version is triggering re-renders on nested pages #14475

Closed
rvmourik opened this issue Aug 3, 2022 · 3 comments · Fixed by nuxt/framework#6325
Closed

edge version is triggering re-renders on nested pages #14475

rvmourik opened this issue Aug 3, 2022 · 3 comments · Fixed by nuxt/framework#6325

Comments

@rvmourik
Copy link
Contributor

rvmourik commented Aug 3, 2022

Environment


  • Operating System: Darwin
  • Node Version: v16.15.1
  • Nuxt Version: 3.0.0-rc.6-27657653.000d81d
  • Package Manager: yarn@1.22.17
  • Builder: vite
  • User Config: head, ssr, buildModules, vite, runtimeConfig, build
  • Runtime Modules: -
  • Build Modules: @nuxtjs/tailwindcss@5.3.1, @vueuse/nuxt@9.0.2, @pinia/nuxt@0.3.1

Reproduction

I tried to reproduce it, but can't get it to fail in stackblitz.

Describe the bug

When i updated to RC.6 I experienced no issues whatsoever, but updating to the latest edge all of the sudden my nested pages triggered two network requests for data. At first I thought the issue was with with the data fetching but after some debugging and placing a console.log in an onMounted hook I saw the console.log got triggered twice on client side navigating (initial load or refresh does not trigger it twice).

I have the following page structure:

layouts
  defaults.vue <-- has <slot>
pages
  workspace
    [workspace]
      dossier.vue  <-- fetched data with server api url (with $fetch)
  workspace.vue <-- has an async await in setup function and a `NuxtPage`
app.vue <-- has `NuxtLayout` and a `NuxtPage`

http://localhost:3000/workspace/dynamicid/dossier

I also tried disabling the date fetching in dossier.vue but the onMounted still gets called twice. When I disable the await in workspace.vue and let it run async the problem isn't there. Also placing an onMounted in workspace.vue get's called twice on navigating (and if i revert to rc.6 it does not).

All of the NuxtPage components do "not" have a page-key.

I think it has something to do with the combination of the top-level await in workspace.vue and maybe missing or present page-keys on the nested routes.

I am very sorry I can't provide you with a reproduction, but if you need any additional information I am happy to provide it to you.

Thanks in advance.

Additional context

Maybe related items:

#13369
nuxt/framework#4677
nuxt/framework#6275

Logs

No response

@danielroe
Copy link
Member

@rvmourik Hopefully resolve in next edge release. Let me know if not.

@rvmourik
Copy link
Contributor Author

rvmourik commented Aug 3, 2022

@danielroe I already updated and it looks promising :-) Will test some more, if I find something I will let you know. Thanks for the quick follow up.

I don't now if it is related, but some other strange thing with routes is happening. I commented with some additional information in #14462, but the issue occurs after updating to latest edge version.

Copy link
Member

Yes, it's related. I'll look into that as well.

@danielroe danielroe added the 3.x label Jan 19, 2023
@danielroe danielroe transferred this issue from nuxt/framework Jan 19, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants