Static GitHub Issues

[3103] "Mismatching childNodes vs. VNode": "nuxt-link" inside a "v-for"

prev: Using window on server side
next: How does the nuxtjs website inline CSS on the server side?

The following snippet in a SSR mode will raise a warning.

div(v-for="tag in tags" :key="tag")
   nuxt-link(:to="{ name: 'somePage'}") Click me
The client-side rendered virtual DOM tree is not matching server-rendered content. This is likely caused by incorrect HTML markup, for example nesting block-level elements inside <p>, or missing <tbody>. Bailing hydration and performing full client-side render.

Actually it's the same either with nuxt-link or just a a element.

Is the warning correct or a false negative? If correct would appreciate some hints to resolve it. (Idea: maybe the warning can link a url to the nuxt website with a solution/mode details)

<!--cmty--><!--cmty_prevent_hook--><div align="right"><sub><em>This question is available on <a href="https://nuxtjs.cmty.io">Nuxt.js</a> community (<a href="https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c2687">#c2687</a>)</em></sub></div>