Skip to content

Commit

Permalink
fix(compiler-core): fix v-bind shorthand for component :is
Browse files Browse the repository at this point in the history
close #10469
close #10471
  • Loading branch information
yyx990803 committed Apr 15, 2024
1 parent 969c5fb commit 04af950
Show file tree
Hide file tree
Showing 2 changed files with 33 additions and 5 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -1231,6 +1231,24 @@ describe('compiler: element transform', () => {
})
})

test('dynamic binding shorthand', () => {
const { node, root } = parseWithBind(`<component :is />`)
expect(root.helpers).toContain(RESOLVE_DYNAMIC_COMPONENT)
expect(node).toMatchObject({
isBlock: true,
tag: {
callee: RESOLVE_DYNAMIC_COMPONENT,
arguments: [
{
type: NodeTypes.SIMPLE_EXPRESSION,
content: 'is',
isStatic: false,
},
],
},
})
})

test('is casting', () => {
const { node, root } = parseWithBind(`<div is="vue:foo" />`)
expect(root.helpers).toContain(RESOLVE_COMPONENT)
Expand Down
20 changes: 15 additions & 5 deletions packages/compiler-core/src/transforms/transformElement.ts
Original file line number Diff line number Diff line change
Expand Up @@ -64,6 +64,7 @@ import {
checkCompatEnabled,
isCompatEnabled,
} from '../compat/compatConfig'
import { processExpression } from './transformExpression'

// some directive transforms (e.g. v-model) may return a symbol for runtime
// import, which should be used instead of a resolveDirective call.
Expand Down Expand Up @@ -253,7 +254,7 @@ export function resolveComponentType(

// 1. dynamic component
const isExplicitDynamic = isComponentTag(tag)
const isProp = findProp(node, 'is')
const isProp = findProp(node, 'is', false, true /* allow empty */)
if (isProp) {
if (
isExplicitDynamic ||
Expand All @@ -263,10 +264,19 @@ export function resolveComponentType(
context,
))
) {
const exp =
isProp.type === NodeTypes.ATTRIBUTE
? isProp.value && createSimpleExpression(isProp.value.content, true)
: isProp.exp
let exp: ExpressionNode | undefined
if (isProp.type === NodeTypes.ATTRIBUTE) {
exp = isProp.value && createSimpleExpression(isProp.value.content, true)
} else {
exp = isProp.exp
if (!exp) {
// #10469 handle :is shorthand
exp = createSimpleExpression(`is`, false, isProp.loc)
if (!__BROWSER__) {
exp = isProp.exp = processExpression(exp, context)
}
}
}
if (exp) {
return createCallExpression(context.helper(RESOLVE_DYNAMIC_COMPONENT), [
exp,
Expand Down

0 comments on commit 04af950

Please sign in to comment.