fix(nuxt): check island element instead of hydration state (#26480)

This commit is contained in:
Julien Huang 2024-03-26 15:03:00 +01:00 committed by GitHub
parent 1dbd46ec99
commit fd7d9d26e2
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -109,15 +109,15 @@ export default defineComponent({
components: {}
}
if (nuxtApp.isHydrating) {
if (instance.vnode.el) {
payloads.slots = toRaw(nuxtApp.payload.data[`${props.name}_${hashId.value}`])?.slots ?? {}
payloads.components = toRaw(nuxtApp.payload.data[`${props.name}_${hashId.value}`])?.components ?? {}
}
const ssrHTML = ref<string>('')
if (import.meta.client && nuxtApp.isHydrating) {
ssrHTML.value = getFragmentHTML(instance.vnode?.el ?? null, true)?.join('') || ''
if (import.meta.client && instance.vnode?.el) {
ssrHTML.value = getFragmentHTML(instance.vnode.el, true)?.join('') || ''
const key = `${props.name}_${hashId.value}`
nuxtApp.payload.data[key] ||= {}
nuxtApp.payload.data[key].html = ssrHTML.value
@ -250,7 +250,7 @@ export default defineComponent({
// this is used to force trigger Teleport when vue makes the diff between old and new node
const isKeyOdd = teleportKey.value === 0 || !!(teleportKey.value && !(teleportKey.value % 2))
if (uid.value && html.value && (import.meta.server || props.lazy ? canTeleport : mounted.value || nuxtApp.isHydrating)) {
if (uid.value && html.value && (import.meta.server || props.lazy ? canTeleport : (mounted.value || instance.vnode?.el))) {
for (const slot in slots) {
if (availableSlots.value.includes(slot)) {
teleports.push(createVNode(Teleport,