8000 v-on: handle multiple key modifiers · bencode/vue@f9676f6 · GitHub
[go: up one dir, main page]

Skip to content

Commit f9676f6

Browse files
committed
v-on: handle multiple key modifiers
1 parent 5b61b19 commit f9676f6

File tree

1 file changed

+26
-46
lines changed
  • src/directives/public

1 file changed

+26
-46
lines changed

src/directives/public/on.js

Lines changed: 26 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,5 @@
11
var _ = require('../../util')
22

3-
// modifiers
4-
var stopRE = /\.stop\b/
5-
var preventRE = /\.prevent\b/
6-
73
// keyCode aliases
84
var keyCodes = {
95
esc: 27,
@@ -17,27 +13,30 @@ var keyCodes = {
1713
down: 40
1814
}
1915

20-
function keyFilter (handler, key) {
21-
var code = keyCodes[key]
22-
if (!code) {
23-
code = parseInt(key, 10)
24-
}
25-
return function (e) {
26-
if (e.keyCode === code) {
16+
function keyFilter (handler, keys) {
17+
var codes = keys.map(function (key) {
18+
var code = keyCodes[key]
19+
if (!code) {
20+
code = parseInt(key, 10)
21+
}
22+
return code
23+
})
24+
return function keyHandler (e) {
25+
if (codes.indexOf(e.keyCode) > -1) {
2726
return handler.call(this, e)
2827
}
2928
}
3029
}
3130

3231
function stopFilter (handler) {
33-
return function (e) {
32+
return function stopHandler (e) {
3433
e.stopPropagation()
3534
return handler.call(this, e)
3635
}
3736
}
3837

3938
function preventFilter (handler) {
40-
return function (e) {
39+
return function preventHandler (e) {
4140
e.preventDefault()
4241
return handler.call(this, e)
4342
}
@@ -49,38 +48,14 @@ module.exports = {
4948
priority: 700,
5049

5150
bind: function () {
52-
// 1.0.0 key filter
53-
var event = this.arg
54-
55-
// stop modifier
56-
if (stopRE.test(event)) {
57-
this.stop = true
58-
event = event.replace(stopRE, '')
59-
}
60-
61-
// prevent modifier
62-
if (preventRE.test(event)) {
63-
this.prevent = true
64-
event = event.replace(preventRE, '')
65-
}
66-
67-
// key modifier
68-
var keyIndex = event.indexOf('.')
69-
if (keyIndex > -1) {
70-
this.event = event.slice(0, keyIndex)
71-
this.key = event.slice(keyIndex + 1)
72-
} else {
73-
this.event = event
74-
}
75-
7651
// deal with iframes
7752
if (
< 8000 /td>
7853
this.el.tagName === 'IFRAME' &&
79-
this.event !== 'load'
54+
this.arg !== 'load'
8055
) {
8156
var self = this
8257
this.iframeBind = function () {
83-
_.on(self.el.contentWindow, self.event, self.handler)
58+
_.on(self.el.contentWindow, self.arg, self.handler)
8459
}
8560
this.on('load', this.iframeBind)
8661
}
@@ -89,22 +64,27 @@ module.exports = {
8964
update: function (handler) {
9065
if (typeof handler !== 'function') {
9166
process.env.NODE_ENV !== 'production' && _.warn(
92-
'v-on:' + this.event + '="' +
67+
'v-on:' + this.arg + '="' +
9368
this.expression + '" expects a function value, ' +
9469
'got ' + handler
9570
)
9671
return
9772
}
9873

9974
// apply modifiers
100-
if (this.stop) {
75+
if (this.modifiers.stop) {
10176
handler = stopFilter(handler)
10277
}
103-
if (this.prevent) {
78+
if (this.modifiers.prevent) {
10479
handler = preventFilter(handler)
10580
}
106-
if (this.key) {
107-
handler = keyFilter(handler, this.key)
81+
// key filter
82+
var keys = Object.keys(this.modifiers)
83+
.filter(function (key) {
84+
return key !== 'stop' && key !== 'prevent'
85+
})
86+
if (keys.length) {
87+
handler = keyFilter(handler, keys)
10888
}
10989

11090
this.reset()
@@ -118,7 +98,7 @@ module.exports = {
11898
if (this.iframeBind) {
11999
this.iframeBind()
120100
} else {
121-
_.on(this.el, this.event, this.handler)
101+
_.on(this.el, this.arg, this.handler)
122102
}
123103
},
124104

@@ -127,7 +107,7 @@ module.exports = {
127107
? this.el.contentWindow
128108
: this.el
129109
if (this.handler) {
130-
_.off(el, this.event, this.handler)
110+
_.off(el, this.arg, this.handler)
131111
}
132112
},
133113

0 commit comments

Comments
 (0)
0