Skip to content

Commit

Permalink
refactor(compiler): remove modelValue from generated code for native …
Browse files Browse the repository at this point in the history 
…v-model
  • Loading branch information
@yyx990803
yyx990803 committed Mar 16, 2020
1 parent 3b2d236 commit 9eef37f
Show file tree
Hide file tree
Showing 3 changed files with 34 additions and 35 deletions.
36 changes: 12 additions & 24 deletions packages/compiler-dom/__tests__/transforms/__snapshots__/vModel.spec.ts.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,9 +8,8 @@ return function render(_ctx, _cache) {
const { vModelDynamic: _vModelDynamic, mergeProps: _mergeProps, createVNode: _createVNode, withDirectives: _withDirectives, openBlock: _openBlock, createBlock: _createBlock } = _Vue
return _withDirectives((_openBlock(), _createBlock(\\"input\\", _mergeProps(obj, {
modelValue: model,
\\"onUpdate:modelValue\\": $event => (model = $event)
}), null, 16 /* FULL_PROPS */, [\\"modelValue\\", \\"onUpdate:modelValue\\"])), [
}), null, 16 /* FULL_PROPS */, [\\"onUpdate:modelValue\\"])), [
[_vModelDynamic, model]
])
}
Expand All @@ -27,9 +26,8 @@ return function render(_ctx, _cache) {
const _directive_bind = _resolveDirective(\\"bind\\")
return _withDirectives((_openBlock(), _createBlock(\\"input\\", {
modelValue: model,
\\"onUpdate:modelValue\\": $event => (model = $event)
}, null, 8 /* PROPS */, [\\"modelValue\\", \\"onUpdate:modelValue\\"])), [
}, null, 8 /* PROPS */, [\\"onUpdate:modelValue\\"])), [
[_directive_bind, val, key],
[_vModelDynamic, model]
])
Expand All @@ -45,9 +43,8 @@ return function render(_ctx, _cache) {
const { vModelText: _vModelText, createVNode: _createVNode, withDirectives: _withDirectives, openBlock: _openBlock, createBlock: _createBlock } = _Vue
return _withDirectives((_openBlock(), _createBlock(\\"input\\", {
modelValue: model,
\\"onUpdate:modelValue\\": $event => (model = $event)
}, null, 8 /* PROPS */, [\\"modelValue\\", \\"onUpdate:modelValue\\"])), [
}, null, 8 /* PROPS */, [\\"onUpdate:modelValue\\"])), [
[
_vModelText,
model,
Expand All @@ -67,9 +64,8 @@ return function render(_ctx, _cache) {
const { vModelText: _vModelText, createVNode: _createVNode, withDirectives: _withDirectives, openBlock: _openBlock, createBlock: _createBlock } = _Vue
return _withDirectives((_openBlock(), _createBlock(\\"input\\", {
modelValue: model,
\\"onUpdate:modelValue\\": $event => (model = $event)
}, null, 8 /* PROPS */, [\\"modelValue\\", \\"onUpdate:modelValue\\"])), [
}, null, 8 /* PROPS */, [\\"onUpdate:modelValue\\"])), [
[
_vModelText,
model,
Expand All @@ -89,9 +85,8 @@ return function render(_ctx, _cache) {
const { vModelText: _vModelText, createVNode: _createVNode, withDirectives: _withDirectives, openBlock: _openBlock, createBlock: _createBlock } = _Vue
return _withDirectives((_openBlock(), _createBlock(\\"input\\", {
modelValue: model,
\\"onUpdate:modelValue\\": $event => (model = $event)
}, null, 8 /* PROPS */, [\\"modelValue\\", \\"onUpdate:modelValue\\"])), [
}, null, 8 /* PROPS */, [\\"onUpdate:modelValue\\"])), [
[
_vModelText,
model,
Expand All @@ -111,9 +106,8 @@ return function render(_ctx, _cache) {
const { vModelText: _vModelText, createVNode: _createVNode, withDirectives: _withDirectives, openBlock: _openBlock, createBlock: _createBlock } = _Vue
return _withDirectives((_openBlock(), _createBlock(\\"input\\", {
modelValue: model,
\\"onUpdate:modelValue\\": $event => (model = $event)
}, null, 8 /* PROPS */, [\\"modelValue\\", \\"onUpdate:modelValue\\"])), [
}, null, 8 /* PROPS */, [\\"onUpdate:modelValue\\"])), [
[_vModelText, model]
])
}
Expand All @@ -129,9 +123,8 @@ return function render(_ctx, _cache) {
return _withDirectives((_openBlock(), _createBlock(\\"input\\", {
type: \\"checkbox\\",
modelValue: model,
\\"onUpdate:modelValue\\": $event => (model = $event)
}, null, 8 /* PROPS */, [\\"modelValue\\", \\"onUpdate:modelValue\\"])), [
}, null, 8 /* PROPS */, [\\"onUpdate:modelValue\\"])), [
[_vModelCheckbox, model]
])
}
Expand All @@ -148,9 +141,8 @@ return function render(_ctx, _cache) {
const _directive_bind = _resolveDirective(\\"bind\\")
return _withDirectives((_openBlock(), _createBlock(\\"input\\", {
modelValue: model,
\\"onUpdate:modelValue\\": $event => (model = $event)
}, null, 8 /* PROPS */, [\\"modelValue\\", \\"onUpdate:modelValue\\"])), [
}, null, 8 /* PROPS */, [\\"onUpdate:modelValue\\"])), [
[_directive_bind, foo, \\"type\\"],
[_vModelDynamic, model]
])
Expand All @@ -167,9 +159,8 @@ return function render(_ctx, _cache) {
return _withDirectives((_openBlock(), _createBlock(\\"input\\", {
type: \\"radio\\",
modelValue: model,
\\"onUpdate:modelValue\\": $event => (model = $event)
}, null, 8 /* PROPS */, [\\"modelValue\\", \\"onUpdate:modelValue\\"])), [
}, null, 8 /* PROPS */, [\\"onUpdate:modelValue\\"])), [
[_vModelRadio, model]
])
}
Expand All @@ -185,9 +176,8 @@ return function render(_ctx, _cache) {
return _withDirectives((_openBlock(), _createBlock(\\"input\\", {
type: \\"text\\",
modelValue: model,
\\"onUpdate:modelValue\\": $event => (model = $event)
}, null, 8 /* PROPS */, [\\"modelValue\\", \\"onUpdate:modelValue\\"])), [
}, null, 8 /* PROPS */, [\\"onUpdate:modelValue\\"])), [
[_vModelText, model]
])
}
Expand All @@ -202,9 +192,8 @@ return function render(_ctx, _cache) {
const { vModelSelect: _vModelSelect, createVNode: _createVNode, withDirectives: _withDirectives, openBlock: _openBlock, createBlock: _createBlock } = _Vue
return _withDirectives((_openBlock(), _createBlock(\\"select\\", {
modelValue: model,
\\"onUpdate:modelValue\\": $event => (model = $event)
}, null, 8 /* PROPS */, [\\"modelValue\\", \\"onUpdate:modelValue\\"])), [
}, null, 8 /* PROPS */, [\\"onUpdate:modelValue\\"])), [
[_vModelSelect, model]
])
}
Expand All @@ -219,9 +208,8 @@ return function render(_ctx, _cache) {
const { vModelText: _vModelText, createVNode: _createVNode, withDirectives: _withDirectives, openBlock: _openBlock, createBlock: _createBlock } = _Vue
return _withDirectives((_openBlock(), _createBlock(\\"textarea\\", {
modelValue: model,
\\"onUpdate:modelValue\\": $event => (model = $event)
}, null, 8 /* PROPS */, [\\"modelValue\\", \\"onUpdate:modelValue\\"])), [
}, null, 8 /* PROPS */, [\\"onUpdate:modelValue\\"])), [
[_vModelText, model]
])
}
Expand Down
12 changes: 12 additions & 0 deletions packages/compiler-dom/src/transforms/vModel.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -104,5 +104,17 @@ export const transformModel: DirectiveTransform = (dir, node, context) => {
)
}

// native vmodel doesn't need the `modelValue` props since they are also
// passed to the runtime as `binding.value`. removing it reduces code size.
baseResult.props = baseResult.props.filter(p => {
if (
p.key.type === NodeTypes.SIMPLE_EXPRESSION &&
p.key.content === 'modelValue'
) {
return false
}
return true
})

return baseResult
}
21 changes: 10 additions & 11 deletions packages/runtime-dom/src/patchProp.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,19 +25,18 @@ export const patchProp: RendererOptions<Node, Element>['patchProp'] = (
case 'style':
patchStyle(el, prevValue, nextValue)
break
case 'modelValue':
case 'onUpdate:modelValue':
// Do nothing. This is handled by v-model directives.
break
default:
if (isOn(key)) {
patchEvent(
el,
key.slice(2).toLowerCase(),
prevValue,
nextValue,
parentComponent
)
// ignore v-model listeners
if (key.indexOf('onUpdate:') < 0) {
patchEvent(
el,
key.slice(2).toLowerCase(),
prevValue,
nextValue,
parentComponent
)
}
} else if (!isSVG && key in el) {
patchDOMProp(
el,
Expand Down

0 comments on commit 9eef37f

Please sign in to comment.