theluyuan/vue3-yuanma
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(compiler): fix template ref codegen for setup-maybe-ref binding types (#4549)

Browse Source 
fix #4546
This commit is contained in:
ygj6 2021-09-16 23:33:16 +08:00 committed by GitHub
parent 14fcced281
commit f29d061124
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 95 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

75
packages/compiler-core/__tests__/transforms/transformElement.spec.ts
View File

@ -1004,6 +1004,81 @@ describe('compiler: element transform', () => {
})
})
test('the binding not exists (inline maybe ref input)', () => {
const { node } = parseWithElementTransform(`<input ref="input"/>`, {
inline: true,
bindingMetadata: {
input: BindingTypes.SETUP_MAYBE_REF
}
})
expect(node.props).toMatchObject({
type: NodeTypes.JS_OBJECT_EXPRESSION,
properties: [
{
type: NodeTypes.JS_PROPERTY,
key: {
type: NodeTypes.SIMPLE_EXPRESSION,
content: 'ref',
isStatic: true
},
value: {
type: NodeTypes.JS_FUNCTION_EXPRESSION,
params: ['_value', '_refs'],
body: {
type: NodeTypes.JS_BLOCK_STATEMENT,
body: [
{
content: `_refs['input'] = _value`
},
{
content: '_isRef(input) && (input.value = _value)'
}
]
}
}
}
]
})
})
test('the binding not exists (inline let ref input)', () => {
const { node } = parseWithElementTransform(`<input ref="input"/>`, {
inline: true,
bindingMetadata: {
input: BindingTypes.SETUP_LET
}
})
expect(node.props).toMatchObject({
type: NodeTypes.JS_OBJECT_EXPRESSION,
properties: [
{
type: NodeTypes.JS_PROPERTY,
key: {
type: NodeTypes.SIMPLE_EXPRESSION,
content: 'ref',
isStatic: true
},
value: {
type: NodeTypes.JS_FUNCTION_EXPRESSION,
params: ['_value', '_refs'],
body: {
type: NodeTypes.JS_BLOCK_STATEMENT,
body: [
{
content: `_refs['input'] = _value`
},
{
content:
'_isRef(input) ? input.value = _value : input = _value'
}
]
}
}
}
]
})
})
test('HYDRATE_EVENTS', () => {
// ignore click events (has dedicated fast path)
const { node } = parseWithElementTransform(`<div @click="foo" />`, {

26
packages/compiler-core/src/transforms/transformElement.ts
View File

@ -48,7 +48,8 @@ import {
KEEP_ALIVE,
SUSPENSE,
UNREF,
GUARD_REACTIVE_PROPS
GUARD_REACTIVE_PROPS,
IS_REF
} from '../runtimeHelpers'
import {
getInnerRange,
@ -61,7 +62,7 @@ import {
} from '../utils'
import { buildSlots } from './vSlot'
import { getConstantType } from './hoistStatic'
import { BindingMetadata, BindingTypes } from '../options'
import { BindingTypes } from '../options'
import {
checkCompatEnabled,
CompilerDeprecationTypes,
@ -475,7 +476,7 @@ export function buildProps(
if (!__BROWSER__ && context.inline && value?.content) {
valueNode = createFunctionExpression(['_value', '_refs'])
valueNode.body = createBlockStatement(
processInlineRef(context.bindingMetadata, value.content)
processInlineRef(context, value.content)
)
}
}
@ -894,15 +895,28 @@ function isComponentTag(tag: string) {
}
function processInlineRef(
bindings: BindingMetadata,
context: TransformContext,
raw: string
): JSChildNode[] {
const body = [createSimpleExpression(`_refs['${raw}'] = _value`)]
const type = bindings[raw]
const { bindingMetadata, helperString } = context
const type = bindingMetadata[raw]
if (type === BindingTypes.SETUP_REF) {
body.push(createSimpleExpression(`${raw}.value = _value`))
} else if (type === BindingTypes.SETUP_MAYBE_REF) {
body.push(
createSimpleExpression(
`${helperString(IS_REF)}(${raw}) && (${raw}.value = _value)`
)
)
} else if (type === BindingTypes.SETUP_LET) {
body.push(createSimpleExpression(`${raw} = _value`))
body.push(
createSimpleExpression(
`${helperString(
IS_REF
)}(${raw}) ? ${raw}.value = _value : ${raw} = _value`
)
)
}
return body
}