fix(compiler-core): transform kebab case props to camelcase on slots (#2490)

fix #2488
This commit is contained in:
edison 2020-11-27 22:48:30 +08:00 committed by GitHub
parent 735af1c7b7
commit ef59a30cab
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 27 additions and 1 deletions

View File

@ -95,7 +95,9 @@ describe('compiler: transform <slot> outlets', () => {
})
test('default slot outlet with props', () => {
const ast = parseWithSlots(`<slot foo="bar" :baz="qux" />`)
const ast = parseWithSlots(
`<slot foo="bar" :baz="qux" :foo-bar="foo-bar" />`
)
expect((ast.children[0] as ElementNode).codegenNode).toMatchObject({
type: NodeTypes.JS_CALL_EXPRESSION,
callee: RENDER_SLOT,
@ -124,6 +126,16 @@ describe('compiler: transform <slot> outlets', () => {
content: `qux`,
isStatic: false
}
},
{
key: {
content: `fooBar`,
isStatic: true
},
value: {
content: `foo-bar`,
isStatic: false
}
}
]
}

View File

@ -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(