fix(compiler-sfc): updated code

Author: baiwusanyu-c

packages/compiler-sfc/__tests__/__snapshots__/compileScriptPropsTransform.spec.ts.snap

@@ -78,6 +78,24 @@ return (_ctx, _cache) => {
 }"
 `;
 
+exports[`sfc props transform > default values w/ runtime declaration & key is string 1`] = `
+"import { mergeDefaults as _mergeDefaults } from 'vue'
+
+export default {
+  props: _mergeDefaults(['foo', 'foo:bar'], {
+  foo: 1,
+  \\"foo:bar\\": 'foo-bar'
+}),
+  setup(__props) {
+
+      
+      
+return () => {}
+}
+
+}"
+`;
+
 exports[`sfc props transform > default values w/ runtime declaration 1`] = `
 "import { mergeDefaults as _mergeDefaults } from 'vue'
 

packages/compiler-sfc/__tests__/compileScriptPropsTransform.spec.ts

@@ -83,6 +83,28 @@ describe('sfc props transform', () => {
 })`)
     assertCode(content)
   })
+  test('default values w/ runtime declaration & key is string', () => {
+    const { content, bindings } = compile(`
+      <script setup>
+      const { foo = 1, 'foo:bar':fooBar = 'foo-bar' } = defineProps(['foo', 'foo:bar'])
+      </script>
+    `)
+    expect(bindings).toStrictEqual({
+      __propsAliases: {
+        fooBar: 'foo:bar'
+      },
+      foo: BindingTypes.PROPS,
+      'foo:bar': BindingTypes.PROPS,
+      fooBar: BindingTypes.PROPS_ALIASED
+    })
+
+    expect(content).toMatch(`
+  props: _mergeDefaults(['foo', 'foo:bar'], {
+  foo: 1,
+  "foo:bar": 'foo-bar'
+}),`)
+    assertCode(content)
+  })
 
   test('default values w/ type declaration', () => {
     const { content } = compile(`

packages/compiler-sfc/src/compileScript.ts

@@ -834,9 +834,7 @@ export function compileScript(
         }
 
         const { type, required } = props[key]
-        // key may contain symbols such
-        // e.g. onUpdate:modelValue -> "onUpdate:modelValue"
-        const finalKey = /^[a-z0-9]+$/i.test(key) ? key : `"${key}"`
+        const finalKey = getFinalPropsKey(key)
         if (!isProd) {
           return `${finalKey}: { type: ${toRuntimeTypeString(
             type
@@ -1630,7 +1628,7 @@ export function compileScript(
       const defaults: string[] = []
       for (const key in propsDestructuredBindings) {
         const d = genDestructuredDefaultValue(key)
-        if (d) defaults.push(`${key}: ${d}`)
+        if (d) defaults.push(`${getFinalPropsKey(key)}: ${d}`)
       }
       if (defaults.length) {
         declCode = `${helper(
@@ -2361,3 +2359,11 @@ export function resolveObjectKey(node: Node, computed: boolean) {
   }
   return undefined
 }
+
+/**
+ * key may contain symbols such
+ * e.g. onUpdate:modelValue -> "onUpdate:modelValue"
+ */
+function getFinalPropsKey(key: string) {
+  return /^[a-z0-9]+$/i.test(key) ? key : `"${key}"`
+}