refactor(component-instance): $forceUpdate

pages.json

@@ -346,9 +346,15 @@
       }
     },
     {
-      "path": "pages/component-instance/force-update/force-update",
+      "path": "pages/component-instance/force-update/force-update-options",
       "style": {
-        "navigationBarTitleText": "$forceUpdate"
+        "navigationBarTitleText": "$forceUpdate 选项式 API"
+      }
+    },
+    {
+      "path": "pages/component-instance/force-update/force-update-composition",
+      "style": {
+        "navigationBarTitleText": "$forceUpdate 组合式 API"
       }
     },
     {

pages/component-instance/force-update/force-update-composition.uvue

 <template>
   <view class="page">
     <view class="split-title">$forceUpdate</view>
-    <text class="uni-common-mt time">Date.now(): {{ Date.now() }}</text>
-    <button class="uni-common-mt trigger-force-update-btn" type="primary" @click="triggerForceUpdate">trigger $forceUpdate</button>
+    <text class="mt-10 time">Date.now(): {{ Date.now() }}</text>
+    <button class="mt-10 trigger-force-update-btn" type="primary" @click="triggerForceUpdate">trigger $forceUpdate</button>
   </view>
 </template>
 
@@ -10,10 +10,10 @@
 const instance = getCurrentInstance()
 
 const triggerForceUpdate = () => {
-  instance.$.forceUpdate()
+  instance?.proxy?.$forceUpdate()
 }
 
 defineExpose({
   triggerForceUpdate
 })
-</script>
+</script>
\ No newline at end of file

pages/component-instance/force-update/force-update.test.js

-const PAGE_PATH = '/pages/component-instance/force-update/force-update'
-
-describe('$forceUpdate', () => {
-  let page
-  beforeAll(async () => {
-    page = await program.reLaunch(PAGE_PATH)
-    await page.waitFor('view')
-  })
-  it('basic', async () => {
-    const timeEl = await page.$('.time')
-    const timeText1 = (await timeEl.text()).replace('Date.now(): ', '')
-
-    const triggerForceUpdateBtn = await page.$('.trigger-force-update-btn')
-    await triggerForceUpdateBtn.tap()
-
-    const timeText2 = (await timeEl.text()).replace('Date.now(): ', '')
-    expect(parseInt(timeText2)).toBeGreaterThan(parseInt(timeText1))
-  })
-})
+const PAGE_PATH = '/pages/component-instance/force-update/force-update-options'
+const PAGE_COMPOSITION_PATH = '/pages/component-instance/force-update/force-update-composition'
+
+describe('$forceUpdate', () => {
+  let page
+
+  it('force-update Options API', async () => {
+    page = await program.reLaunch(PAGE_PATH)
+    await page.waitFor('view')
+    const timeEl = await page.$('.time')
+    const timeText1 = (await timeEl.text()).replace('Date.now(): ', '')
+
+    const triggerForceUpdateBtn = await page.$('.trigger-force-update-btn')
+    await triggerForceUpdateBtn.tap()
+
+    const timeText2 = (await timeEl.text()).replace('Date.now(): ', '')
+    expect(parseInt(timeText2)).toBeGreaterThan(parseInt(timeText1))
+  })
+
+  it('force-update Composition API', async () => {
+    page = await program.reLaunch(PAGE_COMPOSITION_PATH)
+    await page.waitFor('view')
+    const timeEl = await page.$('.time')
+    const timeText1 = (await timeEl.text()).replace('Date.now(): ', '')
+
+    const triggerForceUpdateBtn = await page.$('.trigger-force-update-btn')
+    await triggerForceUpdateBtn.tap()
+
+    const timeText2 = (await timeEl.text()).replace('Date.now(): ', '')
+    expect(parseInt(timeText2)).toBeGreaterThan(parseInt(timeText1))
+  })
+})

pages/index/index.uvue

@@ -261,7 +261,23 @@ export default {
                 {
                   id: 'emit-composition',
                   name: 'defineEmits 组合式 API',
-                  url: 'emit-function-options'
+                  url: 'emit-function-composition'
+                }
+              ]
+            },
+            {
+              id: 'force-update',
+              name: '$force-update',
+              children: [
+                {
+                  id: 'force-update-options',
+                  name: '$forceUpdate 选项式 API',
+                  url: 'force-update-options'
+                },
+                {
+                  id: 'force-update-composition',
+                  name: '$forceUpdate 组合式 API',
+                  url: 'force-update-composition'
                 }
               ]
             }