Skip to content

Commit 355d15f

Browse files
sxzzsxzz
committed
refactor(compiler-vapor): dedupe gen props
1 parent fc70e06 commit 355d15f

File tree

2 files changed

+63
-102
lines changed

2 files changed

+63
-102
lines changed

‎packages/compiler-vapor/src/generators/component.ts

+58-53
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { camelize, extend, isArray } from '@vue/shared'
22
import type { CodegenContext } from '../generate'
3-
import type { CreateComponentIRNode, IRProp } from '../ir'
3+
import type { CreateComponentIRNode, IRProp, IRProps } from '../ir'
44
import {
55
type CodeFragment,
66
NEWLINE,
@@ -21,11 +21,11 @@ export function genCreateComponent(
2121
oper: CreateComponentIRNode,
2222
context: CodegenContext,
2323
): CodeFragment[] {
24-
const { helper, vaporHelper } = context
24+
const { vaporHelper } = context
2525

2626
const tag = genTag()
2727
const isRoot = oper.root
28-
const rawProps = genRawProps()
28+
const rawProps = genRawProps(oper.props, context)
2929

3030
return [
3131
NEWLINE,
@@ -49,63 +49,68 @@ export function genCreateComponent(
4949
)
5050
}
5151
}
52+
}
5253

53-
function genRawProps() {
54-
const props = oper.props
55-
.map(props => {
56-
if (isArray(props)) {
57-
if (!props.length) return
58-
return genStaticProps(props)
59-
} else {
60-
let expr = genExpression(props.value, context)
61-
if (props.handler) expr = genCall(helper('toHandlers'), expr)
62-
return ['() => (', ...expr, ')']
63-
}
64-
})
65-
.filter(Boolean)
66-
if (props.length) {
67-
return genMulti(SEGMENTS_ARRAY, ...props)
68-
}
54+
export function genRawProps(props: IRProps[], context: CodegenContext) {
55+
const frag = props
56+
.map(props => {
57+
if (isArray(props)) {
58+
if (!props.length) return
59+
return genStaticProps(props, context)
60+
} else {
61+
let expr = genExpression(props.value, context)
62+
if (props.handler) expr = genCall(context.helper('toHandlers'), expr)
63+
return ['() => (', ...expr, ')']
64+
}
65+
})
66+
.filter(
67+
Boolean as any as (v: CodeFragment[] | undefined) => v is CodeFragment[],
68+
)
69+
if (frag.length) {
70+
return genMulti(SEGMENTS_ARRAY, ...frag)
6971
}
72+
}
7073

71-
function genStaticProps(props: IRProp[]) {
72-
return genMulti(
73-
SEGMENTS_OBJECT_NEWLINE,
74-
...props.map(prop => {
75-
return [
76-
...genPropKey(prop, context),
77-
': ',
78-
...(prop.handler
79-
? genEventHandler(context, prop.values[0])
80-
: ['() => (', ...genExpression(prop.values[0], context), ')']),
81-
...(prop.model
82-
? [...genModelEvent(prop), ...genModelModifiers(prop)]
83-
: []),
84-
]
85-
}),
86-
)
74+
export function genStaticProps(
75+
props: IRProp[],
76+
context: CodegenContext,
77+
): CodeFragment[] {
78+
return genMulti(
79+
SEGMENTS_OBJECT_NEWLINE,
80+
...props.map(prop => {
81+
return [
82+
...genPropKey(prop, context),
83+
': ',
84+
...(prop.handler
85+
? genEventHandler(context, prop.values[0])
86+
: ['() => (', ...genExpression(prop.values[0], context), ')']),
87+
...(prop.model
88+
? [...genModelEvent(prop), ...genModelModifiers(prop)]
89+
: []),
90+
]
91+
}),
92+
)
8793

88-
function genModelEvent(prop: IRProp): CodeFragment[] {
89-
const name = prop.key.isStatic
90-
? [JSON.stringify(`onUpdate:${camelize(prop.key.content)}`)]
91-
: ['["onUpdate:" + ', ...genExpression(prop.key, context), ']']
92-
const handler = genModelHandler(prop.values[0], context)
94+
function genModelEvent(prop: IRProp): CodeFragment[] {
95+
const name = prop.key.isStatic
96+
? [JSON.stringify(`onUpdate:${camelize(prop.key.content)}`)]
97+
: ['["onUpdate:" + ', ...genExpression(prop.key, context), ']']
98+
const handler = genModelHandler(prop.values[0], context)
9399

94-
return [',', NEWLINE, ...name, ': ', ...handler]
95-
}
100+
return [',', NEWLINE, ...name, ': ', ...handler]
101+
}
96102

97-
function genModelModifiers(prop: IRProp): CodeFragment[] {
98-
const { key, modelModifiers } = prop
99-
if (!modelModifiers || !modelModifiers.length) return []
103+
function genModelModifiers(prop: IRProp): CodeFragment[] {
104+
const { key, modelModifiers } = prop
105+
if (!modelModifiers || !modelModifiers.length) return []
100106

101-
const modifiersKey = key.isStatic
102-
? key.content === 'modelValue'
103-
? [`modelModifiers`]
104-
: [`${key.content}Modifiers`]
105-
: ['[', ...genExpression(key, context), ' + "Modifiers"]']
107+
const modifiersKey = key.isStatic
108+
? key.content === 'modelValue'
109+
? [`modelModifiers`]
110+
: [`${key.content}Modifiers`]
111+
: ['[', ...genExpression(key, context), ' + "Modifiers"]']
106112

107-
const modifiersVal = genDirectiveModifiers(modelModifiers)
108-
return [',', NEWLINE, ...modifiersKey, `: () => ({ ${modifiersVal} })`]
109-
}
113+
const modifiersVal = genDirectiveModifiers(modelModifiers)
114+
return [',', NEWLINE, ...modifiersKey, `: () => ({ ${modifiersVal} })`]
110115
}
111116
}

‎packages/compiler-vapor/src/generators/slotOutlet.ts

+5-49
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,12 @@
1-
import { isArray } from '@vue/shared'
21
import type { CodegenContext } from '../generate'
3-
import type { IRProp, SlotOutletIRNode } from '../ir'
2+
import type { SlotOutletIRNode } from '../ir'
43
import { genBlock } from './block'
54
import { genExpression } from './expression'
6-
import {
7-
type CodeFragment,
8-
NEWLINE,
9-
SEGMENTS_ARRAY,
10-
SEGMENTS_OBJECT_NEWLINE,
11-
buildCodeFragment,
12-
genCall,
13-
genMulti,
14-
} from './utils'
15-
import { genPropKey } from './prop'
16-
import { genEventHandler } from './event'
5+
import { type CodeFragment, NEWLINE, buildCodeFragment, genCall } from './utils'
6+
import { genRawProps } from './component'
177

188
export function genSlotOutlet(oper: SlotOutletIRNode, context: CodegenContext) {
19-
const { helper, vaporHelper } = context
9+
const { vaporHelper } = context
2010
const { id, name, fallback } = oper
2111
const [frag, push] = buildCodeFragment()
2212

@@ -34,44 +24,10 @@ export function genSlotOutlet(oper: SlotOutletIRNode, context: CodegenContext) {
3424
...genCall(
3525
vaporHelper('createSlot'),
3626
nameExpr,
37-
genRawProps() || 'null',
27+
genRawProps(oper.props, context) || 'null',
3828
fallbackArg,
3929
),
4030
)
4131

4232
return frag
43-
44-
// TODO share this with genCreateComponent
45-
function genRawProps() {
46-
const props = oper.props
47-
.map(props => {
48-
if (isArray(props)) {
49-
if (!props.length) return
50-
return genStaticProps(props)
51-
} else {
52-
let expr = genExpression(props.value, context)
53-
if (props.handler) expr = genCall(helper('toHandlers'), expr)
54-
return ['() => (', ...expr, ')']
55-
}
56-
})
57-
.filter(Boolean)
58-
if (props.length) {
59-
return genMulti(SEGMENTS_ARRAY, ...props)
60-
}
61-
}
62-
63-
function genStaticProps(props: IRProp[]) {
64-
return genMulti(
65-
SEGMENTS_OBJECT_NEWLINE,
66-
...props.map(prop => {
67-
return [
68-
...genPropKey(prop, context),
69-
': ',
70-
...(prop.handler
71-
? genEventHandler(context, prop.values[0])
72-
: ['() => (', ...genExpression(prop.values[0], context), ')']),
73-
]
74-
}),
75-
)
76-
}
7733
}

0 commit comments

Comments
 (0)