wip: test case for v-model + inline mode codegen

This commit is contained in:
Evan You 2020-11-17 15:59:09 -05:00
parent 94736f7729
commit a67325140b
3 changed files with 45 additions and 8 deletions

View File

@ -62,13 +62,13 @@ export const transformModel: DirectiveTransform = (dir, node, context) => {
const assigmentExp = isUnrefExp
? // v-model used on a potentially ref binding in <script setup> inline mode.
// not the most beautiful codegen here but it gets the job done.
// the assignment needs to check whether the binding is actually a ref.
createSimpleExpression(
`$event => { if (${context.helperString(IS_REF)}(${rawExp})) {` +
`${rawExp}.value = $event` +
` } else {${context.isTS ? `\n//@ts-ignore\n` : ``}` +
`${rawExp} = $event` +
` }}`,
`$event => (${context.helperString(IS_REF)}(${rawExp}) ` +
`? (${rawExp}.value = $event) ` +
`: ${context.isTS ? `//@ts-ignore\n` : ``}` +
`(${rawExp} = $event)` +
`)`,
false,
exp.loc
)

View File

@ -166,6 +166,29 @@ return (_ctx, _cache) => {
}"
`;
exports[`SFC compile <script setup> inlineTemplate mode v-model codegen with unref() 1`] = `
"import { unref as _unref, isRef as _isRef, vModelText as _vModelText, createVNode as _createVNode, withDirectives as _withDirectives, openBlock as _openBlock, createBlock as _createBlock } from \\"vue\\"
import { ref } from 'vue'
export default {
expose: [],
setup(__props) {
const count = ref(0)
return (_ctx, _cache) => {
return _withDirectives((_openBlock(), _createBlock(\\"input\\", {
\\"onUpdate:modelValue\\": _cache[1] || (_cache[1] = $event => (_isRef(count) ? (count.value = $event) : (count = $event)))
}, null, 512 /* NEED_PATCH */)), [
[_vModelText, _unref(count)]
])
}
}
}"
`;
exports[`SFC compile <script setup> ref: syntax sugar accessing ref binding 1`] = `
"import { ref as _ref } from 'vue'

View File

@ -121,8 +121,7 @@ const bar = 1
test('avoid unref() when necessary', () => {
// function, const, component import
const { content } = compile(
`
<script setup>
`<script setup>
import { ref, defineOptions } from 'vue'
import Foo from './Foo.vue'
import other from './util'
@ -151,6 +150,21 @@ const bar = 1
// no need to mark constant fns in patch flag
expect(content).not.toMatch(`PROPS`)
})
test('v-model codegen with unref()', () => {
const { content } = compile(
`<script setup>
import { ref } from 'vue'
const count = ref(0)
</script>
<template>
<input v-model="count">
</template>
`,
{ inlineTemplate: true }
)
assertCode(content)
})
})
describe('with TypeScript', () => {