diff --git a/pages/component-instance/props/props-composition.uvue b/pages/component-instance/props/props-composition.uvue
index e3db412b8fe934a15fa6353690a0fcc55b109d89..5b8c276ce8a640aed2ebf44d07d1e31eab2d8da4 100644
--- a/pages/component-instance/props/props-composition.uvue
+++ b/pages/component-instance/props/props-composition.uvue
@@ -3,6 +3,7 @@
     <array-literal :str="str" :num="num" :bool="bool" :obj="obj" :arr="arr" />
     <object-type str="str" :num="num" :bool="bool" :obj="obj" :arr="arr" />
     <same-name-prop-default-value />
+    <props-with-defaults />
   </view>
 </template>
 
@@ -10,6 +11,7 @@
 import ArrayLiteral from './array-literal-composition.uvue'
 import ObjectType from "./object-type-composition.uvue";
 import SameNamePropDefaultValue from "./same-name-prop-default-value-composition.uvue";
+import PropsWithDefaults from "./props-with-defaults.uvue";
 
 const str = 'str'
 const num = 10
diff --git a/pages/component-instance/props/props-options.uvue b/pages/component-instance/props/props-options.uvue
index 7cd06b341cf3a0265ddc9d5c7d7b55c34856de8f..a559b767b4ac337015b69295a7ac73f06ffeb796 100644
--- a/pages/component-instance/props/props-options.uvue
+++ b/pages/component-instance/props/props-options.uvue
@@ -3,6 +3,7 @@
     <array-literal :str="str" :num="num" :bool="bool" :obj="obj" :arr="arr" />
     <object-type str="str" :num="num" :bool="bool" :obj="obj" :arr="arr" />
     <same-name-prop-default-value />
+    <props-with-defaults />
   </view>
 </template>
 
@@ -10,12 +11,14 @@
 import ArrayLiteral from './array-literal-options.uvue'
 import ObjectType from "./object-type-options.uvue";
 import SameNamePropDefaultValue from "./same-name-prop-default-value-options.uvue";
+import PropsWithDefaults from "./props-with-defaults.uvue";
 
 export default {
   components: {
     ArrayLiteral,
     ObjectType,
-    SameNamePropDefaultValue
+    SameNamePropDefaultValue,
+    PropsWithDefaults
   },
   data() {
     return {
diff --git a/pages/component-instance/props/props-with-defaults.uvue b/pages/component-instance/props/props-with-defaults.uvue
new file mode 100644
index 0000000000000000000000000000000000000000..c560943c81b836c7ba515809f579b66232dbc48c
--- /dev/null
+++ b/pages/component-instance/props/props-with-defaults.uvue
@@ -0,0 +1,25 @@
+<template>
+  <view class='mt-10'>
+    <text class="mb-10 bold">withDefaults</text>
+    <view class="mb-10 flex flex-row justify-between">
+      <text>msg</text>
+      <text>{{ props.msg }}</text>
+    </view>
+    <view class="mb-10 flex flex-row justify-between">
+      <text>labels</text>
+      <text>{{ JSON.stringify(props.labels) }}</text>
+    </view>
+  </view>
+</template>
+
+<script setup lang="uts">
+interface CustomProps {
+  msg: string
+  labels : string[]
+}
+
+const props = withDefaults(defineProps<CustomProps>(), {
+  msg: 'hello',
+  labels: ():string[] => ['a', 'b']
+})
+</script>