diff --git a/pages/reactivity/core/reactive/reactive.test.js b/pages/reactivity/core/reactive/reactive.test.js
index 965c75063b0e60399912544bec88be4957877b79..f3eb4614872d74cc281a8f7eb7955d46079754fb 100644
--- a/pages/reactivity/core/reactive/reactive.test.js
+++ b/pages/reactivity/core/reactive/reactive.test.js
@@ -17,7 +17,10 @@ describe('reactive', () => {
         expect(await objNum.text()).toBe('0')
 
         const objArr = await page.$('#obj-arr')
-        expect(await objArr.text()).toBe('["a","b","c"]')
+        expect(await objArr.text()).toBe('["a","b","c"]')
+        
+        const arr1 = await page.$('#arr1')
+        expect(await arr1.text()).toBe('[]')
 
         const updateCountBtn = await page.$('#update-count-btn')
         await updateCountBtn.tap()
@@ -41,6 +44,14 @@ describe('reactive', () => {
         
         const updateObj_A_B_C_Btn = await page.$('#update-obj1-a-b-c-btn')
         await updateObj_A_B_C_Btn.tap()
-        expect(await count1.text()).toBe('2')
+        expect(await count1.text()).toBe('2')
+        
+        const updateArr1Btn = await page.$('#update-arr1-btn')
+        await updateArr1Btn.tap()
+        expect(await arr1.text()).toBe('[1,2,3]')
+        
+        const updateArr1ReactiveBtn = await page.$('#update-arr1-reactive-btn')
+        await updateArr1ReactiveBtn.tap()
+        expect(await arr1.text()).toBe('[4,5,6]')
     })
 })
\ No newline at end of file
diff --git a/pages/reactivity/core/reactive/reactive.uvue b/pages/reactivity/core/reactive/reactive.uvue
index 3bf266461b8abcb68ae9c2e65263dea31d0fe7e7..f7f6a5a48fbde52271e85fccab27a6c273ce3831 100644
--- a/pages/reactivity/core/reactive/reactive.uvue
+++ b/pages/reactivity/core/reactive/reactive.uvue
@@ -15,20 +15,26 @@
         <view class="flex justify-between flex-row mb-10">
             <text>obj.arr:</text>
             <text id="obj-arr">{{ JSON.stringify(obj['arr']) }}</text>
-        </view>
-        <view class="flex justify-between flex-row mb-10">
-            <text>count1:</text>
-            <text id="count1">{{ count1 }}</text>
-        </view>
-        <view class="flex justify-between flex-row mb-10">
-            <text>obj1.a.b.c:</text>
-            <text id="obj1-a-b-c">{{ obj1.getString('a.b.c') }}</text>
+        </view>
+        <view class="flex justify-between flex-row mb-10">
+            <text>count1:</text>
+            <text id="count1">{{ count1 }}</text>
+        </view>
+        <view class="flex justify-between flex-row mb-10">
+            <text>obj1.a.b.c:</text>
+            <text id="obj1-a-b-c">{{ obj1.getString('a.b.c') }}</text>
+        </view>
+        <view class="flex justify-between flex-row mb-10">
+            <text>arr1(spread):</text>
+            <text id="arr1">{{ arr1 }}</text>
         </view>
         <button class='mb-10' id="update-count-btn" @click="updateCount">update count</button>
         <button class='mb-10' id="update-obj-str-btn" @click="updateObjStr">update obj.str</button>
         <button class='mb-10' id="update-obj-num-btn" @click="updateObjNum">update obj.num</button>
         <button class='mb-10' id="update-obj-arr-btn" @click="updateObjArr">update obj.arr</button>
         <button class='mb-10' id="update-obj1-a-b-c-btn" @click="updateObj1_A_B_C">update obj1.a.b.c</button>
+        <button class='mb-10' id="update-arr1-btn" @click="updateArr1(false)">update arr1 without reactive</button>
+        <button class='mb-10' id="update-arr1-reactive-btn" @click="updateArr1(true)">update arr1 with reactive</button>
     </view>
 </template>
 
@@ -71,4 +77,15 @@
     function updateObj1_A_B_C() {
         ((obj1["a"] as UTSJSONObject)["b"] as UTSJSONObject)["c"] = "c1-" + Date.now()
     }
+    const arr1 = ref<number[]>([])
+    function test(...args : number[]) {
+        arr1.value = args
+    }
+    function updateArr1(isReactive : boolean) {
+        if (isReactive) {
+            test(...reactive([4, 5, 6]))
+        } else {
+            test(...[1, 2, 3])
+        }
+    }
 </script>
\ No newline at end of file