defineAsyncComponent's loadingComponent option not working in ssr mode? #12836
Answered
by
edison1105
linzhe141
asked this question in
Help/Questions
-
<script setup >
import { defineAsyncComponent} from 'vue'
const FooBar = defineAsyncComponent({
loader: () => new Promise((resolve)=>{
setTimeout(()=>{
resolve({
render(){
return 'result!!!'
}
})
},5000)
}),
loadingComponent: {
render(){
return 'loading...'
}
}
})
</script>
<template>
<FooBar />
</template>
In csr mode, everything is as expected. However, in ssr mode, we can see that there is no loading text. Is this intentional? |
Beta Was this translation helpful? Give feedback.
Answered by
edison1105
Feb 10, 2025
Replies: 1 comment
-
This is expected behavior. When rendering asynchronous components in SSR, it will wait for them to resolve rather than immediately returning the rendering result of the loadingComponent. For example, it might use an asynchronous method in async setup to query a database or other asynchronous functions, and these asynchronous operations cannot be accessed on the client side. |
Beta Was this translation helpful? Give feedback.
0 replies
Answer selected by
linzhe141
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
This is expected behavior. When rendering asynchronous components in SSR, it will wait for them to resolve rather than immediately returning the rendering result of the loadingComponent. For example, it might use an asynchronous method in async setup to query a database or other asynchronous functions, and these asynchronous operations cannot be accessed on the client side.