diff --git a/src/compiler/parser/index.js b/src/compiler/parser/index.js
index a603b36bb55..6f207761b15 100644
--- a/src/compiler/parser/index.js
+++ b/src/compiler/parser/index.js
@@ -5,7 +5,7 @@ import { parseHTML } from './html-parser'
import { parseText } from './text-parser'
import { parseFilters } from './filter-parser'
import { genAssignmentCode } from '../directives/model'
-import { extend, cached, no, camelize } from 'shared/util'
+import { extend, cached, no, camelize, hyphenate } from 'shared/util'
import { isIE, isEdge, isServerRendering } from 'core/util/env'
import {
@@ -512,7 +512,7 @@ function processComponent (el) {
function processAttrs (el) {
const list = el.attrsList
- let i, l, name, rawName, value, modifiers, isProp
+ let i, l, name, rawName, value, modifiers, isProp, syncGen
for (i = 0, l = list.length; i < l; i++) {
name = rawName = list[i].name
value = list[i].value
@@ -538,11 +538,19 @@ function processAttrs (el) {
name = camelize(name)
}
if (modifiers.sync) {
+ syncGen = genAssignmentCode(value, `$event`)
addHandler(
el,
`update:${camelize(name)}`,
- genAssignmentCode(value, `$event`)
+ syncGen
)
+ if (hyphenate(name) !== camelize(name)) {
+ addHandler(
+ el,
+ `update:${hyphenate(name)}`,
+ syncGen
+ )
+ }
}
}
if (isProp || (
diff --git a/test/unit/features/directives/bind.spec.js b/test/unit/features/directives/bind.spec.js
index e9ab1bf7361..b1c2d704c46 100644
--- a/test/unit/features/directives/bind.spec.js
+++ b/test/unit/features/directives/bind.spec.js
@@ -164,6 +164,27 @@ describe('Directive v-bind', () => {
}).then(done)
})
+ it('.sync modifier with kebab case event', done => {
+ const vm = new Vue({
+ template: `