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: ``, + data: { + bar: 1 + }, + components: { + test: { + props: ['fooBar'], + template: `
{{ fooBar }}
` + } + } + }).$mount() + + expect(vm.$el.textContent).toBe('1') + triggerEvent(vm.$el, 'click') + waitForUpdate(() => { + expect(vm.$el.textContent).toBe('2') + }).then(done) + }) + it('bind object', done => { const vm = new Vue({ template: '',