diff --git a/packages/compiler-core/__tests__/transforms/transformSlotOutlet.spec.ts b/packages/compiler-core/__tests__/transforms/transformSlotOutlet.spec.ts index d5e9f757582..82a5c8e50e1 100644 --- a/packages/compiler-core/__tests__/transforms/transformSlotOutlet.spec.ts +++ b/packages/compiler-core/__tests__/transforms/transformSlotOutlet.spec.ts @@ -95,7 +95,9 @@ describe('compiler: transform outlets', () => { }) test('default slot outlet with props', () => { - const ast = parseWithSlots(``) + const ast = parseWithSlots( + `` + ) expect((ast.children[0] as ElementNode).codegenNode).toMatchObject({ type: NodeTypes.JS_CALL_EXPRESSION, callee: RENDER_SLOT, @@ -124,6 +126,16 @@ describe('compiler: transform outlets', () => { content: `qux`, isStatic: false } + }, + { + key: { + content: `fooBar`, + isStatic: true + }, + value: { + content: `foo-bar`, + isStatic: false + } } ] } diff --git a/packages/compiler-core/src/transforms/transformSlotOutlet.ts b/packages/compiler-core/src/transforms/transformSlotOutlet.ts index 58ef0b2f488..f3d5c0c7373 100644 --- a/packages/compiler-core/src/transforms/transformSlotOutlet.ts +++ b/packages/compiler-core/src/transforms/transformSlotOutlet.ts @@ -11,6 +11,7 @@ import { isSlotOutlet, findProp } from '../utils' import { buildProps, PropsExpression } from './transformElement' import { createCompilerError, ErrorCodes } from '../errors' import { RENDER_SLOT } from '../runtimeHelpers' +import { camelize } from '@vue/shared/' export const transformSlotOutlet: NodeTransform = (node, context) => { if (isSlotOutlet(node)) { @@ -68,9 +69,22 @@ export function processSlotOutlet( const propsWithoutName = name ? node.props.filter(p => p !== name) : node.props + if (propsWithoutName.length > 0) { + //#2488 + propsWithoutName.forEach(prop => { + if ( + prop.type === NodeTypes.DIRECTIVE && + prop.arg && + prop.arg.type === NodeTypes.SIMPLE_EXPRESSION + ) { + prop.arg.content = camelize(prop.arg.content) + } + }) + const { props, directives } = buildProps(node, context, propsWithoutName) slotProps = props + if (directives.length) { context.onError( createCompilerError(