theluyuan/vue3-yuanma
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactor(compiler-sfc): use shallowRef for ref sugar destructure

Browse Source
This commit is contained in:
Evan You 2021-08-04 15:39:23 -04:00
parent bc7dd93f92
commit bf2589b1f0
6 changed files with 35 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
packages/compiler-sfc/__tests__/__snapshots__/compileScriptRefSugar.spec.ts.snap
View File

@ -74,16 +74,16 @@ return { a, get }
`; `;
exports[`<script setup> ref sugar array destructure 1`] = ` exports[`<script setup> ref sugar array destructure 1`] = `
"import { ref as _ref } from 'vue' "import { ref as _ref, shallowRef as _shallowRef } from 'vue'
export default { export default {
setup(__props, { expose }) { setup(__props, { expose }) {
expose() expose()
let n = _ref(1), [__a, __b = 1, ...__c] = (useFoo()) let n = _ref(1), [__a, __b = 1, ...__c] = (useFoo())
const a = _ref(__a); const a = _shallowRef(__a);
const b = _ref(__b); const b = _shallowRef(__b);
const c = _ref(__c); const c = _shallowRef(__c);
console.log(n.value, a.value, b.value, c.value) console.log(n.value, a.value, b.value, c.value)
return { n, a, b, c } return { n, a, b, c }
@ -149,17 +149,17 @@ return { a, b, inc }
`; `;
exports[`<script setup> ref sugar nested destructure 1`] = ` exports[`<script setup> ref sugar nested destructure 1`] = `
"import { ref as _ref } from 'vue' "import { shallowRef as _shallowRef } from 'vue'
export default { export default {
setup(__props, { expose }) { setup(__props, { expose }) {
expose() expose()
let [{ a: { b: __b }}] = (useFoo()) let [{ a: { b: __b }}] = (useFoo())
const b = _ref(__b); const b = _shallowRef(__b);
let { c: [__d, __e] } = (useBar()) let { c: [__d, __e] } = (useBar())
const d = _ref(__d); const d = _shallowRef(__d);
const e = _ref(__e); const e = _shallowRef(__e);
console.log(b.value, d.value, e.value) console.log(b.value, d.value, e.value)
return { b, d, e } return { b, d, e }
@ -169,20 +169,20 @@ return { b, d, e }
`; `;
exports[`<script setup> ref sugar object destructure 1`] = ` exports[`<script setup> ref sugar object destructure 1`] = `
"import { ref as _ref } from 'vue' "import { ref as _ref, shallowRef as _shallowRef } from 'vue'
export default { export default {
setup(__props, { expose }) { setup(__props, { expose }) {
expose() expose()
let n = _ref(1), { a: __a, b: __c, d: __d = 1, e: __f = 2, ...__g } = (useFoo()) let n = _ref(1), { a: __a, b: __c, d: __d = 1, e: __f = 2, ...__g } = (useFoo())
const a = _ref(__a); const a = _shallowRef(__a);
const c = _ref(__c); const c = _shallowRef(__c);
const d = _ref(__d); const d = _shallowRef(__d);
const f = _ref(__f); const f = _shallowRef(__f);
const g = _ref(__g); const g = _shallowRef(__g);
let { foo: __foo } = (useSomthing(() => 1)); let { foo: __foo } = (useSomthing(() => 1));
const foo = _ref(__foo); const foo = _shallowRef(__foo);
console.log(n.value, a.value, c.value, d.value, f.value, g.value, foo.value) console.log(n.value, a.value, c.value, d.value, f.value, g.value, foo.value)
return { n, a, c, d, f, g, foo } return { n, a, c, d, f, g, foo }

32
packages/compiler-sfc/__tests__/compileScriptRefSugar.spec.ts
View File

@ -184,14 +184,14 @@ describe('<script setup> ref sugar', () => {
`let n = _ref(1), { a: __a, b: __c, d: __d = 1, e: __f = 2, ...__g } = (useFoo())` `let n = _ref(1), { a: __a, b: __c, d: __d = 1, e: __f = 2, ...__g } = (useFoo())`
) )
expect(content).toMatch(`let { foo: __foo } = (useSomthing(() => 1))`) expect(content).toMatch(`let { foo: __foo } = (useSomthing(() => 1))`)
expect(content).toMatch(`\nconst a = _ref(__a);`) expect(content).toMatch(`\nconst a = _shallowRef(__a);`)
expect(content).not.toMatch(`\nconst b = _ref(__b);`) expect(content).not.toMatch(`\nconst b = _shallowRef(__b);`)
expect(content).toMatch(`\nconst c = _ref(__c);`) expect(content).toMatch(`\nconst c = _shallowRef(__c);`)
expect(content).toMatch(`\nconst d = _ref(__d);`) expect(content).toMatch(`\nconst d = _shallowRef(__d);`)
expect(content).not.toMatch(`\nconst e = _ref(__e);`) expect(content).not.toMatch(`\nconst e = _shallowRef(__e);`)
expect(content).toMatch(`\nconst f = _ref(__f);`) expect(content).toMatch(`\nconst f = _shallowRef(__f);`)
expect(content).toMatch(`\nconst g = _ref(__g);`) expect(content).toMatch(`\nconst g = _shallowRef(__g);`)
expect(content).toMatch(`\nconst foo = _ref(__foo);`) expect(content).toMatch(`\nconst foo = _shallowRef(__foo);`)
expect(content).toMatch( expect(content).toMatch(
`console.log(n.value, a.value, c.value, d.value, f.value, g.value, foo.value)` `console.log(n.value, a.value, c.value, d.value, f.value, g.value, foo.value)`
) )
@ -216,9 +216,9 @@ describe('<script setup> ref sugar', () => {
expect(content).toMatch( expect(content).toMatch(
`let n = _ref(1), [__a, __b = 1, ...__c] = (useFoo())` `let n = _ref(1), [__a, __b = 1, ...__c] = (useFoo())`
) )
expect(content).toMatch(`\nconst a = _ref(__a);`) expect(content).toMatch(`\nconst a = _shallowRef(__a);`)
expect(content).toMatch(`\nconst b = _ref(__b);`) expect(content).toMatch(`\nconst b = _shallowRef(__b);`)
expect(content).toMatch(`\nconst c = _ref(__c);`) expect(content).toMatch(`\nconst c = _shallowRef(__c);`)
expect(content).toMatch(`console.log(n.value, a.value, b.value, c.value)`) expect(content).toMatch(`console.log(n.value, a.value, b.value, c.value)`)
expect(content).toMatch(`return { n, a, b, c }`) expect(content).toMatch(`return { n, a, b, c }`)
expect(bindings).toStrictEqual({ expect(bindings).toStrictEqual({
@ -238,11 +238,11 @@ describe('<script setup> ref sugar', () => {
</script>`) </script>`)
expect(content).toMatch(`let [{ a: { b: __b }}] = (useFoo())`) expect(content).toMatch(`let [{ a: { b: __b }}] = (useFoo())`)
expect(content).toMatch(`let { c: [__d, __e] } = (useBar())`) expect(content).toMatch(`let { c: [__d, __e] } = (useBar())`)
expect(content).not.toMatch(`\nconst a = _ref(__a);`) expect(content).not.toMatch(`\nconst a = _shallowRef(__a);`)
expect(content).not.toMatch(`\nconst c = _ref(__c);`) expect(content).not.toMatch(`\nconst c = _shallowRef(__c);`)
expect(content).toMatch(`\nconst b = _ref(__b);`) expect(content).toMatch(`\nconst b = _shallowRef(__b);`)
expect(content).toMatch(`\nconst d = _ref(__d);`) expect(content).toMatch(`\nconst d = _shallowRef(__d);`)
expect(content).toMatch(`\nconst e = _ref(__e);`) expect(content).toMatch(`\nconst e = _shallowRef(__e);`)
expect(content).toMatch(`return { b, d, e }`) expect(content).toMatch(`return { b, d, e }`)
expect(bindings).toStrictEqual({ expect(bindings).toStrictEqual({
b: BindingTypes.SETUP_REF, b: BindingTypes.SETUP_REF,

4
packages/compiler-sfc/src/compileScript.ts
View File

@ -643,7 +643,7 @@ export function compileScript(
// append binding declarations after the parent statement // append binding declarations after the parent statement
s.appendLeft( s.appendLeft(
statement.end! + startOffset, statement.end! + startOffset,
`\nconst ${nameId.name} = ${helper('ref')}(__${nameId.name});` `\nconst ${nameId.name} = ${helper('shallowRef')}(__${nameId.name});`
) )
} }
} }
@ -677,7 +677,7 @@ export function compileScript(
// append binding declarations after the parent statement // append binding declarations after the parent statement
s.appendLeft( s.appendLeft(
statement.end! + startOffset, statement.end! + startOffset,
`\nconst ${nameId.name} = ${helper('ref')}(__${nameId.name});` `\nconst ${nameId.name} = ${helper('shallowRef')}(__${nameId.name});`
) )
} }
} }

0
packages/runtime-core/src/helpers/refMacros.ts → packages/runtime-core/src/helpers/refSugar.ts
View File

4
packages/runtime-core/src/index.ts
View File

@ -352,6 +352,6 @@ export const compatUtils = (
__COMPAT__ ? _compatUtils : null __COMPAT__ ? _compatUtils : null
) as typeof _compatUtils ) as typeof _compatUtils
// Ref macros ------------------------------------------------------------------ // Ref sugar macros ------------------------------------------------------------
// for dts generation only // for dts generation only
export { $ref, $computed, $raw, $fromRefs } from './helpers/refMacros' export { $ref, $computed, $raw, $fromRefs } from './helpers/refSugar'

0
test-dts/refMacros.test-d.ts → test-dts/regSugar.test-d.ts
View File