From 14adaa5f3a433cac60b796671db8db9c61dc8dff Mon Sep 17 00:00:00 2001 From: Amour1688 Date: Sun, 18 Apr 2021 11:00:35 +0800 Subject: [PATCH] fix: using v-slots without children should not be spread --- .../babel-plugin-jsx/src/transform-vue-jsx.ts | 34 +++++++++++-------- .../test/__snapshots__/snapshot.test.ts.snap | 6 ++++ .../babel-plugin-jsx/test/snapshot.test.ts | 10 +++--- 3 files changed, 31 insertions(+), 19 deletions(-) diff --git a/packages/babel-plugin-jsx/src/transform-vue-jsx.ts b/packages/babel-plugin-jsx/src/transform-vue-jsx.ts index c2da06f..926adc9 100644 --- a/packages/babel-plugin-jsx/src/transform-vue-jsx.ts +++ b/packages/babel-plugin-jsx/src/transform-vue-jsx.ts @@ -90,21 +90,25 @@ const transformJSXElement = ( ---> {{ default: () => [a, b], ...slots }} ---> {[a, b]} */ - VNodeChild = isComponent ? t.objectExpression([ - !!children.length && t.objectProperty( - t.identifier('default'), - t.arrowFunctionExpression([], t.arrayExpression(buildIIFE(path, children))), - ), - ...(slots ? ( - t.isObjectExpression(slots) - ? (slots! as t.ObjectExpression).properties - : [t.spreadElement(slots!)] - ) : []), - optimize && t.objectProperty( - t.identifier('_'), - t.numericLiteral(slotFlag), - ), - ].filter(Boolean as any)) : t.arrayExpression(children); + VNodeChild = isComponent + ? children.length + ? t.objectExpression([ + !!children.length && t.objectProperty( + t.identifier('default'), + t.arrowFunctionExpression([], t.arrayExpression(buildIIFE(path, children))), + ), + ...(slots ? ( + t.isObjectExpression(slots) + ? (slots! as t.ObjectExpression).properties + : [t.spreadElement(slots!)] + ) : []), + optimize && t.objectProperty( + t.identifier('_'), + t.numericLiteral(slotFlag), + ), + ].filter(Boolean as any)) + : slots + : t.arrayExpression(children); } else if (children.length === 1) { /* {a} or {() => a} diff --git a/packages/babel-plugin-jsx/test/__snapshots__/snapshot.test.ts.snap b/packages/babel-plugin-jsx/test/__snapshots__/snapshot.test.ts.snap index 5d57453..551a558 100644 --- a/packages/babel-plugin-jsx/test/__snapshots__/snapshot.test.ts.snap +++ b/packages/babel-plugin-jsx/test/__snapshots__/snapshot.test.ts.snap @@ -262,6 +262,12 @@ _createVNode(_resolveComponent(\\"C\\"), { }, null, 8, [\\"model\\", \\"onUpdate:model\\"]);" `; +exports[`using v-slots without children should not be spread: using v-slots without children should not be spread 1`] = ` +"import { createVNode as _createVNode, resolveDirective as _resolveDirective, resolveComponent as _resolveComponent } from \\"vue\\"; + +_createVNode(_resolveComponent(\\"A\\"), null, slots);" +`; + exports[`v-model target value support variable: v-model target value support variable 1`] = ` "import { createVNode as _createVNode, resolveComponent as _resolveComponent, Fragment as _Fragment } from \\"vue\\"; const foo = 'foo'; diff --git a/packages/babel-plugin-jsx/test/snapshot.test.ts b/packages/babel-plugin-jsx/test/snapshot.test.ts index 8af97ad..b399461 100644 --- a/packages/babel-plugin-jsx/test/snapshot.test.ts +++ b/packages/babel-plugin-jsx/test/snapshot.test.ts @@ -23,7 +23,7 @@ const transpile = ( }, )); -const tests: Test[] = [ +[ { name: 'input[type="checkbox"]', from: '', @@ -188,9 +188,11 @@ const tests: Test[] = [ `, }, -]; - -tests.forEach(( + { + name: 'using v-slots without children should not be spread', + from: '', + }, +].forEach(( { name, from }, ) => { test(