fix(v-model): should use dynamic directive on input with dynamic v-bind
This commit is contained in:
@@ -1,5 +1,42 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`compiler: transform v-model input w/ dynamic v-bind 1`] = `
|
||||
"const _Vue = Vue
|
||||
|
||||
return function render() {
|
||||
with (this) {
|
||||
const { vModelDynamic: _vModelDynamic, mergeProps: _mergeProps, createVNode: _createVNode, withDirectives: _withDirectives, createBlock: _createBlock, openBlock: _openBlock } = _Vue
|
||||
|
||||
return (_openBlock(), _withDirectives(_createBlock(\\"input\\", _mergeProps(obj, {
|
||||
modelValue: model,
|
||||
\\"onUpdate:modelValue\\": $event => (model = $event)
|
||||
}), null, 16 /* FULL_PROPS */, [\\"modelValue\\", \\"onUpdate:modelValue\\"]), [
|
||||
[_vModelDynamic, model]
|
||||
]))
|
||||
}
|
||||
}"
|
||||
`;
|
||||
|
||||
exports[`compiler: transform v-model input w/ dynamic v-bind 2`] = `
|
||||
"const _Vue = Vue
|
||||
|
||||
return function render() {
|
||||
with (this) {
|
||||
const { vModelDynamic: _vModelDynamic, createVNode: _createVNode, withDirectives: _withDirectives, resolveDirective: _resolveDirective, createBlock: _createBlock, openBlock: _openBlock } = _Vue
|
||||
|
||||
const _directive_bind = _resolveDirective(\\"bind\\")
|
||||
|
||||
return (_openBlock(), _withDirectives(_createBlock(\\"input\\", {
|
||||
modelValue: model,
|
||||
\\"onUpdate:modelValue\\": $event => (model = $event)
|
||||
}, null, 8 /* PROPS */, [\\"modelValue\\", \\"onUpdate:modelValue\\"]), [
|
||||
[_directive_bind, val, key],
|
||||
[_vModelDynamic, model]
|
||||
]))
|
||||
}
|
||||
}"
|
||||
`;
|
||||
|
||||
exports[`compiler: transform v-model modifiers .lazy 1`] = `
|
||||
"const _Vue = Vue
|
||||
|
||||
|
||||
@@ -63,6 +63,19 @@ describe('compiler: transform v-model', () => {
|
||||
expect(generate(root).code).toMatchSnapshot()
|
||||
})
|
||||
|
||||
test('input w/ dynamic v-bind', () => {
|
||||
const root = transformWithModel('<input v-bind="obj" v-model="model" />')
|
||||
|
||||
expect(root.helpers).toContain(V_MODEL_DYNAMIC)
|
||||
expect(generate(root).code).toMatchSnapshot()
|
||||
|
||||
const root2 = transformWithModel(
|
||||
'<input v-bind:[key]="val" v-model="model" />'
|
||||
)
|
||||
expect(root2.helpers).toContain(V_MODEL_DYNAMIC)
|
||||
expect(generate(root2).code).toMatchSnapshot()
|
||||
})
|
||||
|
||||
test('simple expression for select', () => {
|
||||
const root = transformWithModel('<select v-model="model" />')
|
||||
|
||||
|
||||
@@ -3,7 +3,8 @@ import {
|
||||
DirectiveTransform,
|
||||
ElementTypes,
|
||||
findProp,
|
||||
NodeTypes
|
||||
NodeTypes,
|
||||
hasDynamicKeyVBind
|
||||
} from '@vue/compiler-core'
|
||||
import { createDOMCompilerError, DOMErrorCodes } from '../errors'
|
||||
import {
|
||||
@@ -75,6 +76,10 @@ export const transformModel: DirectiveTransform = (dir, node, context) => {
|
||||
break
|
||||
}
|
||||
}
|
||||
} else if (hasDynamicKeyVBind(node)) {
|
||||
// element has bindings with dynamic keys, which can possibly contain
|
||||
// "type".
|
||||
directiveToUse = V_MODEL_DYNAMIC
|
||||
} else {
|
||||
// text type
|
||||
__DEV__ && checkDuplicatedValue()
|
||||
|
||||
Reference in New Issue
Block a user