Open huang-julien opened 8 months ago
Start a new pull request in StackBlitz Codeflow.
it looks like getCurrentInstance
doesn't exist for second useLazyAsyncData
. So instead of going here https://github.com/nuxt/nuxt/blob/main/packages/nuxt/src/app/composables/asyncData.ts#L359-L362 it goes to https://github.com/nuxt/nuxt/blob/main/packages/nuxt/src/app/composables/asyncData.ts#L363-L365
I believe that this is working correctly and that the issue lies with how it is documented. The example you provided @huang-julien uses await
on useLazyAsyncData
but these composables are not async and I think the awaits are causing the problem.
I believe the awaits make the vue component instance become undefined for any sequential await
calls (ref: https://nuxt.com/docs/api/composables/use-nuxt-app ). And since instance is undefined, lazyAsyncData has to revert to just asyncData which blocks the route change because it can't call instance._nuxtOnBeforeMountCbs.push(initialFetch)
. This is also why one useLazyAsyncData
with await
works fine because the component instance is there on the first call.
Playground with working multiple useLazyAsyncData
: https://stackblitz.com/edit/nuxt-starter-3ojz7s?file=pages%2Findex.vue
If this is correct, I suggest we make a simple doc change to remove the superfluous await
. https://nuxt.com/docs/api/composables/use-lazy-async-data
Didn't had the time to investigate yet, but it can be a unctx issue
Ah, if removing await
can cause a vulnerability then I will continue investigating. I am very new to this codebase, but it seems like nuxtApp.runWithContext
isn't ensuring that vue component instance is available - but maybe that is not it's function? I will look into ways to ensure that the component ctx is available
Ah, if removing
await
can cause a vulnerability then I will continue investigating. I am very new to this codebase, but it seems likenuxtApp.runWithContext
isn't ensuring that vue component instance is available - but maybe that is not it's function? I will look into ways to ensure that the component ctx is available
The issue is actually even one step before that. The entire nuxtApp
is undefined in this case. As the docs state: async context only works with <script setup>
, defineNuxtPlugin
and defineNuxtRouteMiddleware
but not in composables.
Vue currently only supports async context restoration for Githubissues.
Environment
Build Modules: -
Reproduction
https://stackblitz.com/edit/nuxt-starter-t7zx5g?file=composables%2Ftest.ts
Describe the bug
Using 2
useLazyAsyncData
make the page change blockingAdditional context
No response
Logs
No response