root
/
vue3-core
mirror of https://github.com/vuejs/core.git
1
0
Fork 0
Code Issues Actions 3 Packages Projects Releases Wiki Activity

wip: create anchor for DynamicFragment in ssr slot vnode fallback
ci / test (push) Has been cancelled Details
ci / continuous-release (push) Has been cancelled Details

This commit is contained in:
daiwei 2025-08-02 09:09:35 +08:00
parent 71262384db
commit 31cc2251d6
1 changed files with 19 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
packages/runtime-vapor/src/fragment.ts
View File

@ -74,7 +74,7 @@ export class DynamicFragment extends VaporFragment {
update(render?: BlockFn, key: any = render): void { update(render?: BlockFn, key: any = render): void {
if (key === this.current) { if (key === this.current) {
if (isHydrating) this.hydrate(this.anchorLabel!, true) if (isHydrating && this.anchorLabel) this.hydrate(this.anchorLabel!, true)
return return
} }
this.current = key this.current = key
@ -155,30 +155,33 @@ export class DynamicFragment extends VaporFragment {
} }
hydrate(label: string, isEmpty: boolean = false): void { hydrate(label: string, isEmpty: boolean = false): void {
if (!label && isEmpty) return // for `v-if="false"`, the node will be an empty comment, use it as the anchor.
// for `v-if="false"` the node will be an empty comment, use it as the anchor.
// otherwise, find next sibling vapor fragment anchor // otherwise, find next sibling vapor fragment anchor
if (label === 'if' && isEmpty) { if (label === 'if' && isEmpty) {
this.anchor = locateVaporFragmentAnchor(currentHydrationNode!, '')! this.anchor = locateVaporFragmentAnchor(currentHydrationNode!, '')!
} else { } else {
let anchor = locateVaporFragmentAnchor(currentHydrationNode!, label)! this.anchor = locateVaporFragmentAnchor(currentHydrationNode!, label)!
if (!anchor) { if (!this.anchor) {
// TODO: comment anchors are not included in ssr slot vnode fallback // comment anchors are not included in ssr slot vnode fallback
if (label === 'slot') { if (label === 'slot') {
// fallback to fragment end anchor for // fallback to fragment end anchor for
anchor = locateVaporFragmentAnchor(currentHydrationNode!, ']')! this.anchor = locateVaporFragmentAnchor(currentHydrationNode!, ']')!
} else if (label === 'if') { } else {
// create anchor
const { parentNode, nextSibling } = currentHydrationNode!
parentNode!.insertBefore(
(this.anchor = __DEV__ ? createComment(label) : createTextNode()),
nextSibling,
)
} }
} }
if (anchor) {
this.anchor = anchor
} else if (__DEV__) {
// this should not happen
throw new Error(`${label} fragment anchor node was not found.`)
}
} }
advanceHydrationNode(this.anchor)
if (this.anchor) {
advanceHydrationNode(this.anchor)
} else if (__DEV__) {
throw new Error(`${label} fragment anchor node was not found.`)
}
} }
} }