-
-
Notifications
You must be signed in to change notification settings - Fork 4.8k
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
redirection within onMounted
hook with transition enabled causes a hydration error
#14524
Comments
It may not be the issue - not looked into it in more detail - but your index page does have two root elements: <template>
<nuxt-link to="/parent">Go to parent</nuxt-link>
<nuxt-link to="/other">Go to other</nuxt-link>
</template> |
🤦♂️ Oops, you're right. I've fixed that in the linked StackBlitz and the behaviour is still the same. |
I've updated the title because this issue seems simpler than my original case. Nested routes are irrelevant, this behaviour is the same with a simple routing structure: Using |
I think the root issue here is the same as #13471 and is an upstream suspense + transition issue. You can work around it by disabling page transitions, which will be easier once nuxt/framework#5859 is merged. See for example: https://stackblitz.com/edit/github-fu1vnc-9x1zyu |
onMounted
hook with transition enabled causes a hydration error
Environment
Darwin
v16.13.0
3.0.0-rc.6
npm@8.11.0
vite
build
,buildModules
,runtimeConfig
-
@pinia/nuxt@0.3.1
Reproduction
Was able to reproduce a simplified version of my code which sees the same problem:
https://stackblitz.com/edit/github-r6amfg?file=app.vue
Describe the bug
Update: See comment thread for simpler description of the issue - my original description is unnecessarily complicated to reproduce the problem.
In my project, I have two levels of routing. The app.vue has a
<NuxtPage>
, and the/home/
route has a<NuxtPage>
A logo is always present in the top left, which will navigate to
/home/
(no subroute specified). Apages/home/index.vue
file provides a default subroute by callingnavigateTo('home/foo')
, which so far as I can tell is the best way to handle a default subroute in Nuxt 3.Clicking this logo works fine from most pages, but if clicked from within
home/foo
orhome/bar
it causes the following error:Failed to execute 'insertBefore' on 'Node': The node before which the new node is to be inserted is not a child of this node
No
home/*
subroutes will load successfully from then on.I'm aware of #12735 and don't see how the solution therein around ensuring only single-root elements is relevant to my codebase, or the stackblitz reproduction linked here.
Additional context
No response
Logs
The text was updated successfully, but these errors were encountered: