Skip to content

Commit f6d7b90

Browse files
committed
wip(vapor): corresponding runtime behavior for if/for/slot-outlet post compiler change
1 parent 9722574 commit f6d7b90

File tree

3 files changed

+46
-9
lines changed

3 files changed

+46
-9
lines changed

packages/runtime-vapor/src/apiCreateFor.ts

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,8 @@ import { currentInstance, isVaporComponent } from './component'
2222
import type { DynamicSlot } from './componentSlots'
2323
import { renderEffect } from './renderEffect'
2424
import { VaporVForFlags } from '../../shared/src/vaporFlags'
25+
import { isHydrating, locateHydrationNode } from './dom/hydration'
26+
import { insertionAnchor, insertionParent } from './insertionState'
2527

2628
class ForBlock extends VaporFragment {
2729
scope: EffectScope | undefined
@@ -56,7 +58,6 @@ type ResolvedSource = {
5658
keys?: string[]
5759
}
5860

59-
/*! #__NO_SIDE_EFFECTS__ */
6061
export const createFor = (
6162
src: () => Source,
6263
renderItem: (
@@ -66,12 +67,18 @@ export const createFor = (
6667
) => Block,
6768
getKey?: (item: any, key: any, index?: number) => any,
6869
flags = 0,
69-
// hydrationNode?: Node,
7070
): VaporFragment => {
71+
const _insertionParent = insertionParent
72+
const _insertionAnchor = insertionAnchor
73+
if (isHydrating) {
74+
locateHydrationNode()
75+
}
76+
7177
let isMounted = false
7278
let oldBlocks: ForBlock[] = []
7379
let newBlocks: ForBlock[]
7480
let parent: ParentNode | undefined | null
81+
// TODO handle this in hydration
7582
const parentAnchor = __DEV__ ? createComment('for') : createTextNode()
7683
const frag = new VaporFragment(oldBlocks)
7784
const instance = currentInstance!
@@ -356,6 +363,11 @@ export const createFor = (
356363
} else {
357364
renderEffect(renderList)
358365
}
366+
367+
if (!isHydrating && _insertionParent) {
368+
insert(frag, _insertionParent, _insertionAnchor)
369+
}
370+
359371
return frag
360372
}
361373

Lines changed: 19 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,31 @@
1-
import { type Block, type BlockFn, DynamicFragment } from './block'
1+
import { type Block, type BlockFn, DynamicFragment, insert } from './block'
2+
import { isHydrating, locateHydrationNode } from './dom/hydration'
3+
import { insertionAnchor, insertionParent } from './insertionState'
24
import { renderEffect } from './renderEffect'
35

46
export function createIf(
57
condition: () => any,
68
b1: BlockFn,
79
b2?: BlockFn,
810
once?: boolean,
9-
// hydrationNode?: Node,
1011
): Block {
12+
const _insertionParent = insertionParent
13+
const _insertionAnchor = insertionAnchor
14+
if (isHydrating) {
15+
locateHydrationNode()
16+
}
17+
18+
let frag: Block
1119
if (once) {
12-
return condition() ? b1() : b2 ? b2() : []
20+
frag = condition() ? b1() : b2 ? b2() : []
1321
} else {
14-
const frag = __DEV__ ? new DynamicFragment('if') : new DynamicFragment()
15-
renderEffect(() => frag.update(condition() ? b1 : b2))
16-
return frag
22+
frag = __DEV__ ? new DynamicFragment('if') : new DynamicFragment()
23+
renderEffect(() => (frag as DynamicFragment).update(condition() ? b1 : b2))
1724
}
25+
26+
if (!isHydrating && _insertionParent) {
27+
insert(frag, _insertionParent, _insertionAnchor)
28+
}
29+
30+
return frag
1831
}

packages/runtime-vapor/src/componentSlots.ts

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,11 @@
11
import { EMPTY_OBJ, NO, hasOwn, isArray, isFunction } from '@vue/shared'
2-
import { type Block, type BlockFn, DynamicFragment } from './block'
2+
import { type Block, type BlockFn, DynamicFragment, insert } from './block'
33
import { rawPropsProxyHandlers } from './componentProps'
44
import { currentInstance, isRef } from '@vue/runtime-dom'
55
import type { LooseRawProps, VaporComponentInstance } from './component'
66
import { renderEffect } from './renderEffect'
7+
import { insertionAnchor, insertionParent } from './insertionState'
8+
import { isHydrating, locateHydrationNode } from './dom/hydration'
79

810
export type RawSlots = Record<string, VaporSlot> & {
911
$?: DynamicSlotSource[]
@@ -90,6 +92,12 @@ export function createSlot(
9092
rawProps?: LooseRawProps | null,
9193
fallback?: VaporSlot,
9294
): Block {
95+
const _insertionParent = insertionParent
96+
const _insertionAnchor = insertionAnchor
97+
if (isHydrating) {
98+
locateHydrationNode()
99+
}
100+
93101
const instance = currentInstance as VaporComponentInstance
94102
const rawSlots = instance.rawSlots
95103
const slotProps = rawProps
@@ -135,5 +143,9 @@ export function createSlot(
135143
renderSlot()
136144
}
137145

146+
if (!isHydrating && _insertionParent) {
147+
insert(fragment, _insertionParent, _insertionAnchor)
148+
}
149+
138150
return fragment
139151
}

0 commit comments

Comments
 (0)