2019-09-23 10:19:42 +08:00
|
|
|
import { DirectiveTransform } from '../transform'
|
2019-09-25 10:39:20 +08:00
|
|
|
import { createObjectProperty, createExpression, ExpressionNode } from '../ast'
|
2019-09-23 10:19:42 +08:00
|
|
|
import { capitalize } from '@vue/shared'
|
2019-09-25 10:39:20 +08:00
|
|
|
import { createCompilerError, ErrorCodes } from '../errors'
|
2019-09-23 10:19:42 +08:00
|
|
|
|
|
|
|
// v-on without arg is handled directly in ./element.ts due to it affecting
|
|
|
|
// codegen for the entire props object. This transform here is only for v-on
|
|
|
|
// *with* args.
|
2019-09-25 10:56:57 +08:00
|
|
|
export const transformOn: DirectiveTransform = (
|
|
|
|
{ arg, exp, loc, modifiers },
|
|
|
|
context
|
|
|
|
) => {
|
|
|
|
if (!exp && !modifiers.length) {
|
2019-09-25 10:39:20 +08:00
|
|
|
context.onError(createCompilerError(ErrorCodes.X_V_ON_NO_EXPRESSION, loc))
|
|
|
|
}
|
2019-09-26 10:29:37 +08:00
|
|
|
const { content, isStatic, loc: argLoc } = arg!
|
2019-09-25 10:39:20 +08:00
|
|
|
let eventName: ExpressionNode
|
|
|
|
if (isStatic) {
|
|
|
|
// static arg
|
|
|
|
eventName = createExpression(`on${capitalize(content)}`, true, argLoc)
|
|
|
|
} else {
|
2019-09-26 10:29:37 +08:00
|
|
|
// dynamic arg. turn it into a compound expression.
|
2019-09-25 10:39:20 +08:00
|
|
|
eventName = arg!
|
2019-09-26 10:29:37 +08:00
|
|
|
;(
|
|
|
|
eventName.children ||
|
|
|
|
(eventName.children = [{ ...eventName, children: undefined }])
|
|
|
|
).unshift(`"on" + `)
|
2019-09-25 10:39:20 +08:00
|
|
|
}
|
2019-09-23 10:19:42 +08:00
|
|
|
// TODO .once modifier handling since it is platform agnostic
|
|
|
|
// other modifiers are handled in compiler-dom
|
|
|
|
return {
|
|
|
|
props: createObjectProperty(
|
|
|
|
eventName,
|
2019-09-25 10:03:28 +08:00
|
|
|
exp || createExpression(`() => {}`, false, loc),
|
|
|
|
loc
|
2019-09-23 10:19:42 +08:00
|
|
|
),
|
|
|
|
needRuntime: false
|
|
|
|
}
|
|
|
|
}
|