fix: missing colon in event name for dynamic model arguments (#642)

vuejs · Sep 11, 2024 · ad14b2d · ad14b2d
1 parent 8de3f20
commit ad14b2d
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 6 deletions.
diff --git a/packages/babel-plugin-jsx/src/transform-vue-jsx.ts b/packages/babel-plugin-jsx/src/transform-vue-jsx.ts
@@ -208,7 +208,7 @@ const buildProps = (path: NodePath<t.JSXElement>, state: State) => {
             }
 
             const updateName = isDynamic
-              ? t.binaryExpression('+', t.stringLiteral('onUpdate'), propName)
+              ? t.binaryExpression('+', t.stringLiteral('onUpdate:'), propName)
               : t.stringLiteral(
                   `onUpdate:${
                     (propName as t.StringLiteral)?.value || 'modelValue'

diff --git a/packages/babel-plugin-jsx/test/__snapshots__/snapshot.test.ts.snap b/packages/babel-plugin-jsx/test/__snapshots__/snapshot.test.ts.snap
@@ -269,7 +269,7 @@ const b = {
 };
 _createVNode(_Fragment, null, [_createVNode(_resolveComponent("A"), {
   [foo]: xx,
-  ["onUpdate" + foo]: $event => xx = $event
+  ["onUpdate:" + foo]: $event => xx = $event
 }, null, 16), _createVNode(_resolveComponent("B"), {
   "modelValue": xx,
   "modelModifiers": {
@@ -281,25 +281,25 @@ _createVNode(_Fragment, null, [_createVNode(_resolveComponent("A"), {
   [foo + "Modifiers"]: {
     "a": true
   },
-  ["onUpdate" + foo]: $event => xx = $event
+  ["onUpdate:" + foo]: $event => xx = $event
 }, null, 16), _createVNode(_resolveComponent("D"), {
   [foo === 'foo' ? 'a' : 'b']: xx,
   [(foo === 'foo' ? 'a' : 'b') + "Modifiers"]: {
     "a": true
   },
-  ["onUpdate" + (foo === 'foo' ? 'a' : 'b')]: $event => xx = $event
+  ["onUpdate:" + (foo === 'foo' ? 'a' : 'b')]: $event => xx = $event
 }, null, 16), _createVNode(_resolveComponent("E"), {
   [a()]: xx,
   [a() + "Modifiers"]: {
     "a": true
   },
-  ["onUpdate" + a()]: $event => xx = $event
+  ["onUpdate:" + a()]: $event => xx = $event
 }, null, 16), _createVNode(_resolveComponent("F"), {
   [b.c]: xx,
   [b.c + "Modifiers"]: {
     "a": true
   },
-  ["onUpdate" + b.c]: $event => xx = $event
+  ["onUpdate:" + b.c]: $event => xx = $event
 }, null, 16)]);"
 `;