Skip to content

Commit a1d1145

Browse files
committed
fix(v-model): should generate component-specific code for tags with "is" attribute
fix #6066
1 parent 8d66691 commit a1d1145

File tree

3 files changed

+43
-2
lines changed

3 files changed

+43
-2
lines changed

src/compiler/parser/index.js

+3-1
Original file line numberDiff line numberDiff line change
@@ -483,7 +483,9 @@ function processAttrs (el) {
483483
)
484484
}
485485
}
486-
if (isProp || platformMustUseProp(el.tag, el.attrsMap.type, name)) {
486+
if (!el.component && (
487+
isProp || platformMustUseProp(el.tag, el.attrsMap.type, name)
488+
)) {
487489
addProp(el, name, value)
488490
} else {
489491
addAttr(el, name, value)

src/platforms/web/compiler/directives/model.js

+5-1
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,11 @@ export default function model (
4040
}
4141
}
4242

43-
if (tag === 'select') {
43+
if (el.component) {
44+
genComponentModel(el, value, modifiers)
45+
// component v-model doesn't need extra runtime
46+
return false
47+
} else if (tag === 'select') {
4448
genSelect(el, value, modifiers)
4549
} else if (tag === 'input' && type === 'checkbox') {
4650
genCheckboxModel(el, value, modifiers)

test/unit/features/directives/model-component.spec.js

+35
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,41 @@ describe('Directive v-model component', () => {
3636
}).then(done)
3737
})
3838

39+
it('should work with native tags with "is"', done => {
40+
const vm = new Vue({
41+
data: {
42+
msg: 'hello'
43+
},
44+
template: `
45+
<div>
46+
<p>{{ msg }}</p>
47+
<input is="test" v-model="msg">
48+
</div>
49+
`,
50+
components: {
51+
test: {
52+
props: ['value'],
53+
template: `<input :value="value" @input="$emit('input', $event.target.value)">`
54+
}
55+
}
56+
}).$mount()
57+
document.body.appendChild(vm.$el)
58+
waitForUpdate(() => {
59+
const input = vm.$el.querySelector('input')
60+
input.value = 'world'
61+
triggerEvent(input, 'input')
62+
}).then(() => {
63+
expect(vm.msg).toEqual('world')
64+
expect(vm.$el.querySelector('p').textContent).toEqual('world')
65+
vm.msg = 'changed'
66+
}).then(() => {
67+
expect(vm.$el.querySelector('p').textContent).toEqual('changed')
68+
expect(vm.$el.querySelector('input').value).toEqual('changed')
69+
}).then(() => {
70+
document.body.removeChild(vm.$el)
71+
}).then(done)
72+
})
73+
3974
it('should support customization via model option', done => {
4075
const spy = jasmine.createSpy('update')
4176
const vm = new Vue({

0 commit comments

Comments
 (0)