diff --git a/packages/compiler-core/__tests__/transforms/transformElement.spec.ts b/packages/compiler-core/__tests__/transforms/transformElement.spec.ts
index 17e6b5bb14a..b72533ee3f9 100644
--- a/packages/compiler-core/__tests__/transforms/transformElement.spec.ts
+++ b/packages/compiler-core/__tests__/transforms/transformElement.spec.ts
@@ -1209,12 +1209,7 @@ describe('compiler: element transform', () => {
test('force block for inline before-update handlers w/ children', () => {
expect(
- parseWithElementTransform(`
hello
`).node
- .isBlock
- ).toBe(true)
-
- expect(
- parseWithElementTransform(`hello
`).node
+ parseWithElementTransform(`hello
`).node
.isBlock
).toBe(true)
})
diff --git a/packages/compiler-core/__tests__/transforms/vOn.spec.ts b/packages/compiler-core/__tests__/transforms/vOn.spec.ts
index 3c56ce9aadd..8f943a7491f 100644
--- a/packages/compiler-core/__tests__/transforms/vOn.spec.ts
+++ b/packages/compiler-core/__tests__/transforms/vOn.spec.ts
@@ -438,6 +438,32 @@ describe('compiler: transform v-on', () => {
})
})
+ test('vue: prefixed events', () => {
+ const { node } = parseWithVOn(
+ ``
+ )
+ expect((node.codegenNode as VNodeCall).props).toMatchObject({
+ properties: [
+ {
+ key: {
+ content: `onVnodeMounted`
+ },
+ value: {
+ content: `onMount`
+ }
+ },
+ {
+ key: {
+ content: `onVnodeBeforeUpdate`
+ },
+ value: {
+ content: `onBeforeUpdate`
+ }
+ }
+ ]
+ })
+ })
+
describe('cacheHandler', () => {
test('empty handler', () => {
const { root, node } = parseWithVOn(``, {
diff --git a/packages/compiler-core/src/transforms/transformElement.ts b/packages/compiler-core/src/transforms/transformElement.ts
index fb0ddd528c7..e79a560a2b0 100644
--- a/packages/compiler-core/src/transforms/transformElement.ts
+++ b/packages/compiler-core/src/transforms/transformElement.ts
@@ -550,7 +550,7 @@ export function buildProps(
(isVBind && isStaticArgOf(arg, 'key')) ||
// inline before-update hooks need to force block so that it is invoked
// before children
- (isVOn && hasChildren && isStaticArgOf(arg, 'vnodeBeforeUpdate', true))
+ (isVOn && hasChildren && isStaticArgOf(arg, 'vue:before-update'))
) {
shouldUseBlock = true
}
diff --git a/packages/compiler-core/src/transforms/vOn.ts b/packages/compiler-core/src/transforms/vOn.ts
index 0a804021d15..060a7ef9097 100644
--- a/packages/compiler-core/src/transforms/vOn.ts
+++ b/packages/compiler-core/src/transforms/vOn.ts
@@ -42,7 +42,11 @@ export const transformOn: DirectiveTransform = (
let eventName: ExpressionNode
if (arg.type === NodeTypes.SIMPLE_EXPRESSION) {
if (arg.isStatic) {
- const rawName = arg.content
+ let rawName = arg.content
+ // TODO deprecate @vnodeXXX usage
+ if (rawName.startsWith('vue:')) {
+ rawName = `vnode-${rawName.slice(4)}`
+ }
// for all event listeners, auto convert it to camelCase. See issue #2249
eventName = createSimpleExpression(
toHandlerKey(camelize(rawName)),
diff --git a/packages/compiler-core/src/utils.ts b/packages/compiler-core/src/utils.ts
index 0c62f3043d9..c9e310fe089 100644
--- a/packages/compiler-core/src/utils.ts
+++ b/packages/compiler-core/src/utils.ts
@@ -42,14 +42,7 @@ import {
WITH_MEMO,
OPEN_BLOCK
} from './runtimeHelpers'
-import {
- isString,
- isObject,
- hyphenate,
- extend,
- NOOP,
- camelize
-} from '@vue/shared'
+import { isString, isObject, hyphenate, extend, NOOP } from '@vue/shared'
import { PropsExpression } from './transforms/transformElement'
import { parseExpression } from '@babel/parser'
import { Expression } from '@babel/types'
@@ -298,14 +291,9 @@ export function findProp(
export function isStaticArgOf(
arg: DirectiveNode['arg'],
- name: string,
- camel?: boolean
+ name: string
): boolean {
- return !!(
- arg &&
- isStaticExp(arg) &&
- (camel ? camelize(arg.content) : arg.content) === name
- )
+ return !!(arg && isStaticExp(arg) && arg.content === name)
}
export function hasDynamicKeyVBind(node: ElementNode): boolean {