refactor: use makeMap in v-on dom transform
This commit is contained in:
parent
65a0207c7b
commit
6f3e768d52
@ -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),
|
||||
|
Loading…
Reference in New Issue
Block a user