NuxtLink and SSR pages
Hello,
I have a dynamic page (let's call it A) on my nuxt 3.13 project:
~/pages/networks/[name] that uses useAsyncData and is server-side rendered.
I also have another dynamic page (let's call it B) in the same project, also server-side rendered, in which I have added a NuxtLink that points to the network page:
<NuxtLink to="/networks/networkName">
Name
</NuxtLink>
I followed the documentation: https://nuxt.com/docs/api/components/nuxt-link
However, ever since I did that, on click on that link, my page B no longer renders, and I just have an error
error:"[native Error <>Error\n at createError (http://fr.localhost:3002/_nuxt/node_modules/h3/dist/index.mjs?v=cce497c7:78:15)\n at createError (http://fr.localhost:3002/_nuxt/node_modules/nuxt/dist/app/composables/error.js?v=cce497c7:33:21)\n at showError (http://fr.localhost:3002/_nuxt/node_modules/nuxt/dist/app/composables/error.js?v=cce497c7:9:21)\n at Proxy.fetchNetworkData (http://fr.localhost:3002/_nuxt/store/network.ts:65:18)\n at async http://fr.localhost:3002/_nuxt/pages/networks/[name].vue:152:7]"
Am I doing something wrong here? Do NuxtLink work well with server-rendered pages?
I already tried to use the noPrefetch attribute of NuxtLink but it doesn't change anything.
And with a regular <a> tag, navigation works properly.
Many thanks!5 Replies
Did you mean to add the colon? Since it’s a string, should be written as such.
maybe you can write it with string literals if you want to use the variables.
i assume that the networkName is a variable, you can write it like
Oh yeah that was a mistake when I pasted the code but indeed in my code it is like that!
do you have any reproductions ?
Well, it seems it was an issue wrt. useAsyncData, data wasn't loaded at the right time. I fixed this and now I don't have this issue anymore. Thanks for following up on it!