diff --git a/packages/reactivity-transform/__tests__/__snapshots__/reactivityTransform.spec.ts.snap b/packages/reactivity-transform/__tests__/__snapshots__/reactivityTransform.spec.ts.snap index f73357a5efa..82b1704e802 100644 --- a/packages/reactivity-transform/__tests__/__snapshots__/reactivityTransform.spec.ts.snap +++ b/packages/reactivity-transform/__tests__/__snapshots__/reactivityTransform.spec.ts.snap @@ -281,11 +281,14 @@ const props = defineProps<{msg: string; ids?: string[]}>() `; exports[`should unwrap TS node 1`] = ` -"import { ref as _ref } from 'vue' +"import { ref as _ref, toRef as _toRef } from 'vue' const bar = (ref(1))! as number const baz = (bar)! as Ref const qux = (_ref(10)!) + const __$temp_1 = ({ a: 'a', b: 'b' })! as any, + a = _toRef(__$temp_1, 'a'), + b = _toRef(__$temp_1, 'b'); " `; diff --git a/packages/reactivity-transform/__tests__/reactivityTransform.spec.ts b/packages/reactivity-transform/__tests__/reactivityTransform.spec.ts index 6060e9b6d6e..c44d170926d 100644 --- a/packages/reactivity-transform/__tests__/reactivityTransform.spec.ts +++ b/packages/reactivity-transform/__tests__/reactivityTransform.spec.ts @@ -495,6 +495,7 @@ test('should unwrap TS node', () => { const bar = $(ref(1))! as number const baz = $$(bar)! as Ref const qux = ($ref(10)!) + const { a, b } = $({ a: 'a', b: 'b' })! as any `, { filename: 'foo.ts' } ) diff --git a/packages/reactivity-transform/src/reactivityTransform.ts b/packages/reactivity-transform/src/reactivityTransform.ts index 3592120f52c..a951ae2b972 100644 --- a/packages/reactivity-transform/src/reactivityTransform.ts +++ b/packages/reactivity-transform/src/reactivityTransform.ts @@ -312,7 +312,13 @@ export function transformAST( init.type === 'CallExpression' && init.callee.type === 'Identifier' if (isCall && (refCall = isRefCreationCall((init.callee as any).name))) { - processRefDeclaration(refCall, decl.id, init, stmt.kind === 'const') + processRefDeclaration( + refCall, + decl.id, + decl.init!, + init, + stmt.kind === 'const' + ) } else { const isProps = isRoot && isCall && (init.callee as Identifier).name === 'defineProps' @@ -332,6 +338,7 @@ export function transformAST( function processRefDeclaration( method: string, id: VariableDeclarator['id'], + init: Node, call: CallExpression, isConst: boolean ) { @@ -344,9 +351,9 @@ export function transformAST( // single variable registerRefBinding(id, isConst) } else if (id.type === 'ObjectPattern') { - processRefObjectPattern(id, call, isConst) + processRefObjectPattern(id, init, isConst) } else if (id.type === 'ArrayPattern') { - processRefArrayPattern(id, call, isConst) + processRefArrayPattern(id, init, isConst) } } else { // shorthands @@ -366,7 +373,7 @@ export function transformAST( function processRefObjectPattern( pattern: ObjectPattern, - call: CallExpression, + value: Node, isConst: boolean, tempVar?: string, path: PathSegment[] = [] @@ -402,12 +409,12 @@ export function transformAST( // { foo: bar } nameId = p.value } else if (p.value.type === 'ObjectPattern') { - processRefObjectPattern(p.value, call, isConst, tempVar, [ + processRefObjectPattern(p.value, value, isConst, tempVar, [ ...path, key ]) } else if (p.value.type === 'ArrayPattern') { - processRefArrayPattern(p.value, call, isConst, tempVar, [ + processRefArrayPattern(p.value, value, isConst, tempVar, [ ...path, key ]) @@ -417,12 +424,12 @@ export function transformAST( nameId = p.value.left defaultValue = p.value.right } else if (p.value.left.type === 'ObjectPattern') { - processRefObjectPattern(p.value.left, call, isConst, tempVar, [ + processRefObjectPattern(p.value.left, value, isConst, tempVar, [ ...path, [key, p.value.right] ]) } else if (p.value.left.type === 'ArrayPattern') { - processRefArrayPattern(p.value.left, call, isConst, tempVar, [ + processRefArrayPattern(p.value.left, value, isConst, tempVar, [ ...path, [key, p.value.right] ]) @@ -446,7 +453,7 @@ export function transformAST( : `'${nameId.name}'` const defaultStr = defaultValue ? `, ${snip(defaultValue)}` : `` s.appendLeft( - call.end! + offset, + value.end! + offset, `,\n ${nameId.name} = ${helper( 'toRef' )}(${source}, ${keyStr}${defaultStr})` @@ -454,13 +461,13 @@ export function transformAST( } } if (nameId) { - s.appendLeft(call.end! + offset, ';') + s.appendLeft(value.end! + offset, ';') } } function processRefArrayPattern( pattern: ArrayPattern, - call: CallExpression, + value: Node, isConst: boolean, tempVar?: string, path: PathSegment[] = [] @@ -487,9 +494,9 @@ export function transformAST( // [...a] error(`reactivity destructure does not support rest elements.`, e) } else if (e.type === 'ObjectPattern') { - processRefObjectPattern(e, call, isConst, tempVar, [...path, i]) + processRefObjectPattern(e, value, isConst, tempVar, [...path, i]) } else if (e.type === 'ArrayPattern') { - processRefArrayPattern(e, call, isConst, tempVar, [...path, i]) + processRefArrayPattern(e, value, isConst, tempVar, [...path, i]) } if (nameId) { registerRefBinding(nameId, isConst) @@ -497,7 +504,7 @@ export function transformAST( const source = pathToString(tempVar, path) const defaultStr = defaultValue ? `, ${snip(defaultValue)}` : `` s.appendLeft( - call.end! + offset, + value.end! + offset, `,\n ${nameId.name} = ${helper( 'toRef' )}(${source}, ${i}${defaultStr})` @@ -505,7 +512,7 @@ export function transformAST( } } if (nameId) { - s.appendLeft(call.end! + offset, ';') + s.appendLeft(value.end! + offset, ';') } }