8000 feat(jsx-directive): add $stable flag for v-slot (#942) · vue-macros/vue-macros@b863491 · GitHub
[go: up one dir, main page]
Skip to content

Commit b863491

Browse files
zhiyuanzmjzhiyuanzmj
authored
feat(jsx-directive): add $stable flag for v-slot (#942)
* perf(jsx-directive): add $stable flag for v-slot * fix: lint
1 parent d7d0272 commit b863491

File tree

2 files changed

+17
-20
lines changed

2 files changed

+17
-20
lines changed

‎packages/jsx-directive/src/core/v-slot.ts

Lines changed: 11 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
1-
import { importHelperFn, type MagicStringAST } from '@vue-macros/common'
21
import type { OptionsResolved } from '..'
32
import { resolveVFor } from './v-for'
43
import type { JSXAttribute, JSXElement, Node } from '@babel/types'
4+
import type { MagicStringAST } from '@vue-macros/common'
55

66
export type VSlotMap = Map<
77
JSXElement,
@@ -23,17 +23,19 @@ export function transformVSlot(
2323
s: MagicStringAST,
2424
options: OptionsResolved,
2525
): void {
26-
const { prefix, lib } = options
26+
const { prefix } = options
2727
Array.from(nodeMap)
2828
.reverse()
2929
.forEach(([node, { attributeMap, vSlotAttribute }]) => {
3030
const result = [` v-slots={{`]
3131
const attributes = Array.from(attributeMap)
32+
let isStable = true
3233
attributes.forEach(
3334
([attribute, { children, vIfAttribute, vForAttribute }], index) => {
3435
if (!attribute) return
3536

3637
if (vIfAttribute) {
38+
isStable = false
3739
if (`${prefix}if` === vIfAttribute.name.name) {
3840
result.push('...')
3941
}
@@ -50,6 +52,7 @@ export function transformVSlot(
5052
}
5153

5254
if (vForAttribute) {
55+
isStable = false
5356
result.push(
5457
'...Object.fromEntries(',
5558
resolveVFor(vForAttribute, s, { ...options, lib: 'vue' }),
@@ -64,20 +67,11 @@ export function transformVSlot(
6467
: 'default'
6568
attributeName = attributeName.replace(/\$(.*)\$/, (_, $1) => {
6669
isDynamic = true
70+
isStable = false
6771
return $1.replaceAll('_', '.')
6872
})
6973
result.push(
70-
isDynamic
71-
? `[${importHelperFn(
72-
s,
73-
0,
74-
'unref',
75-
undefined,
76-
lib.startsWith('vue')
77-
? 'vue'
78-
: '@vue-macros/jsx-directive/helpers',
79-
)}(${attributeName})]`
80-
: `'${attributeName}'`,
74+
isDynamic ? `[${attributeName}]` : `'${attributeName}'`,
8175
vForAttribute ? ', ' : ': ',
8276
)
8377

@@ -132,6 +126,10 @@ export function transformVSlot(
132126
},
133127
)
134128

129+
if (isStable) {
130+
result.push('$stable: true,')
131+
}
132+
135133
if (attributeMap.has(null)) {
136134
result.push(`default: () => <>`)
137135
} else {

‎packages/jsx-directive/tests/__snapshots__/v-slot.test.ts.snap

Lines changed: 6 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,6 @@
33
exports[`v-slot > vue > ./fixtures/v-slot/index.vue 1`] = `
44
"<script setup lang="tsx">
55
import { renderList as __MACROS_renderList } from "vue";
6-
import { unref as __MACROS_unref } from "vue";
76
import { expectTypeOf } from 'expect-type'
87
import Child from './child.vue'
98
import type { FunctionalComponent } from 'vue'
@@ -16,7 +15,7 @@ const Comp: FunctionalComponent<
1615
}
1716
> = (props, { slots }) => {
1817
return (
19-
<Child v-slots={{...Object.fromEntries(__MACROS_renderList(slots, (Slot, slotName) => ([[__MACROS_unref(slotName)], (scope) => <>
18+
<Child v-slots={{...Object.fromEntries(__MACROS_renderList(slots, (Slot, slotName) => ([[slotName], (scope) => <>
2019
<Slot {...scope} />
2120
</>,]))),}}
2221
@@ -30,15 +29,15 @@ defineRender(() => (
3029
<div>
3130
<Child v-slots={{'bottom': ({ foo }) => <>
3231
{foo}
33-
<Child v-slots={{'default': () => <>default</>,}}></Child>
34-
</>,}}></Child>
32+
<Child v-slots={{'default': () => <>default</>,$stable: true,}}></Child>
33+
</>,$stable: true,}}></Child>
3534
36-
<Comp v-slots={{'default': () => <>default</>,}}></Comp>
37-
<Child v-slots={{'bottom': ({ foo }) => <>{foo}</>,}}></Child>
35+
<Comp v-slots={{'default': () => <>default</>,$stable: true,}}></Comp>
36+
<Child v-slots={{'bottom': ({ foo }) => <>{foo}</>,$stable: true,}}></Child>
3837
3938
<Child baz={baz} v-slots={{'title': ({ foo }) => <>
4039
{expectTypeOf<string>(foo)}
41-
</>,}}></Child>
40+
</>,$stable: true,}}></Child>
4241
4342
<Child v-slots={{...(show) ? {'bottom': ({ foo }) => <>
4443
{foo}

0 commit comments

Comments
 (0)
0