refactor: use makeMap in v-on dom transform

This commit is contained in:
Evan You 2019-10-15 22:29:52 -04:00
parent 65a0207c7b
commit 6f3e768d52

View File

@ -10,25 +10,21 @@ import {
ObjectExpression
} from '@vue/compiler-core'
import { V_ON_MODIFIERS_GUARD, V_ON_KEYS_GUARD } from '../runtimeHelpers'
import { makeMap } from '@vue/shared'
const EVENT_OPTION_MODIFIERS = { passive: true, once: true, capture: true }
const NOT_KEY_MODIFIERS = {
stop: true,
prevent: true,
self: true,
// system
ctrl: true,
shift: true,
alt: true,
meta: true,
const isEventOptionModifier = /*#__PURE__*/ makeMap(`passive,once,capture`)
const isNonKeyModifier = /*#__PURE__*/ makeMap(
// event propagation management
`stop,prevent,self,` +
// system modifers + exact
`ctrl,shift,alt,meta,exact,` +
// mouse
left: true,
middle: true,
right: true,
// exact
exact: true
}
const KEYBOARD_EVENTS = { onkeyup: true, onkeydown: true, onkeypress: true }
`left,middle,right`
)
const isKeyboardEvent = /*#__PURE__*/ makeMap(
`onkeyup,onkeydown,onkeypress`,
true
)
export const transformOn: DirectiveTransform = (dir, node, context) => {
const { modifiers } = dir
@ -36,18 +32,18 @@ export const transformOn: DirectiveTransform = (dir, node, context) => {
if (!modifiers.length) return baseResult
const { key, value } = baseResult.props[0]
const runtimeModifiers = modifiers.filter(m => !(m in EVENT_OPTION_MODIFIERS))
const runtimeModifiers = modifiers.filter(m => !isEventOptionModifier(m))
let handler = createCallExpression(context.helper(V_ON_MODIFIERS_GUARD), [
value,
JSON.stringify(runtimeModifiers.filter(m => m in NOT_KEY_MODIFIERS))
JSON.stringify(runtimeModifiers.filter(isNonKeyModifier))
])
const keyModifiers = runtimeModifiers.filter(m => !(m in NOT_KEY_MODIFIERS))
const keyModifiers = runtimeModifiers.filter(m => !isNonKeyModifier(m))
if (
keyModifiers.length &&
// if event name is dynamic, always wrap with keys guard
(key.type === NodeTypes.COMPOUND_EXPRESSION ||
!key.isStatic ||
key.content.toLowerCase() in KEYBOARD_EVENTS)
isKeyboardEvent(key.content))
) {
handler = createCallExpression(context.helper(V_ON_KEYS_GUARD), [
handler,
@ -57,9 +53,7 @@ export const transformOn: DirectiveTransform = (dir, node, context) => {
let returnExp: CallExpression | ObjectExpression = handler
const eventOptionModifiers = modifiers.filter(
modifier => modifier in EVENT_OPTION_MODIFIERS
)
const eventOptionModifiers = modifiers.filter(isEventOptionModifier)
if (eventOptionModifiers.length) {
returnExp = createObjectExpression([
createObjectProperty('handler', handler),