From 8e97c0c5f68cb834017d1206225763e289194612 Mon Sep 17 00:00:00 2001
From: zhenyuWang <13641039885@163.com>
Date: Wed, 17 Apr 2024 20:20:21 +0800
Subject: [PATCH] refactor(lifecycle): component

---
 components/CompositionAPILifecycle.uvue       | 101 -----------------
 pages.json                                    |  26 ++---
 .../page-lifecycle/page-lifecycle.test.js     |  71 ------------
 .../page-lifecycle/page-lifecycle.uvue        | 105 ------------------
 pages/index/index.uvue                        |  45 ++++++--
 .../component/ChildComponentComposition.uvue  | 101 +++++++++++++++++
 .../component/ChildComponentOptions.uvue      |   6 +-
 .../component/component-composition.test.js}  |  29 +++--
 .../component/component-composition.uvue}     |  20 ++--
 ...nent.test.js => component-options.test.js} |   4 +-
 ...{component.uvue => component-options.uvue} |  41 +++----
 pages/lifecycle/page/page-composition.uvue    |  16 +--
 pages/lifecycle/page/page-options.uvue        |   2 +-
 13 files changed, 208 insertions(+), 359 deletions(-)
 delete mode 100644 components/CompositionAPILifecycle.uvue
 delete mode 100644 pages/composition-api/lifecycle/page-lifecycle/page-lifecycle.test.js
 delete mode 100644 pages/composition-api/lifecycle/page-lifecycle/page-lifecycle.uvue
 create mode 100644 pages/lifecycle/component/ChildComponentComposition.uvue
 rename components/OptionsAPILifecycle.uvue => pages/lifecycle/component/ChildComponentOptions.uvue (87%)
 rename pages/{composition-api/lifecycle/component-lifecycle/component-lifecycle.test.js => lifecycle/component/component-composition.test.js} (68%)
 rename pages/{composition-api/lifecycle/component-lifecycle/component-lifecycle.uvue => lifecycle/component/component-composition.uvue} (62%)
 rename pages/lifecycle/component/{component.test.js => component-options.test.js} (89%)
 rename pages/lifecycle/component/{component.uvue => component-options.uvue} (50%)

diff --git a/components/CompositionAPILifecycle.uvue b/components/CompositionAPILifecycle.uvue
deleted file mode 100644
index 9fdb92d..0000000
--- a/components/CompositionAPILifecycle.uvue
+++ /dev/null
@@ -1,101 +0,0 @@
-<template>
-  title: {{ title }}
-  <button class="component-lifecycle-btn uni-common-mt" @click="updateTitle">
-    updateTitle
-  </button>
-</template>
-
-<script setup>
-  import { state, setLifeCycleNum } from '../store/index.uts'
-
-  const title = ref('component for composition API lifecycle test')
-  
-  const emit = defineEmits<{
-    (e : 'updateIsScroll', val : boolean) : void
-  }>()
-
-  onLoad((_ : OnLoadOptions) => {
-    // 自动化测试
-    setLifeCycleNum(state.lifeCycleNum + 100)
-  })
-  onPageShow(() => {
-    // 自动化测试
-    setLifeCycleNum(state.lifeCycleNum + 10)
-  })
-  onReady(() => {
-    // 自动化测试
-    // TODO: onReady 未触发
-    setLifeCycleNum(state.lifeCycleNum + 10)
-  })
-  
-  onPullDownRefresh(() => {
-    // 自动化测试
-    setLifeCycleNum(state.lifeCycleNum + 10)
-  })
-  onPageScroll((_) => {
-    // 自动化测试
-    emit('updateIsScroll', true)
-  })
-  onReachBottom(() => {
-    // 自动化测试
-    setLifeCycleNum(state.lifeCycleNum + 10)
-  })
-  onBackPress((_ : OnBackPressOptions) : boolean | null => {
-    // 自动化测试
-    setLifeCycleNum(state.lifeCycleNum - 10)
-    return null
-  })
-  onPageHide(() => {
-    // 自动化测试
-    setLifeCycleNum(state.lifeCycleNum - 10)
-  })
-  onUnload(() => {
-    // 自动化测试
-    setLifeCycleNum(state.lifeCycleNum - 100)
-  })
-
-  onBeforeMount(() => {
-    // 自动化测试
-    setLifeCycleNum(state.lifeCycleNum + 1)
-    console.log('component for lifecycle test mounted')
-  })
-
-  onMounted(() => {
-    // 自动化测试
-    setLifeCycleNum(state.lifeCycleNum + 1)
-    console.log('component for lifecycle test mounted')
-  })
-
-  onBeforeUpdate(() => {
-    // 自动化测试
-    setLifeCycleNum(state.lifeCycleNum + 1)
-    console.log('component for lifecycle test beforeUpdate')
-  })
-
-  onUpdated(() => {
-    // 自动化测试
-    setLifeCycleNum(state.lifeCycleNum + 1)
-    console.log('component for lifecycle test updated')
-  })
-
-  onBeforeUnmount(() => {
-    // 自动化测试
-    setLifeCycleNum(state.lifeCycleNum - 1)
-    console.log('component for lifecycle test beforeUnmount')
-  })
-
-  onUnmounted(() => {
-    // 自动化测试
-    setLifeCycleNum(state.lifeCycleNum - 1)
-    console.log('component for lifecycle test unmounted')
-  })
-
-  // TODO: app-android 不触发
-  onActivated(() => { })
-  // TODO: app-android 不触发
-  onDeactivated(() => { })
-
-  const updateTitle = () => {
-    title.value = 'component for lifecycle test updated'
-  }
-</script>
\ No newline at end of file
diff --git a/pages.json b/pages.json
index 638ce0e..0df3db2 100644
--- a/pages.json
+++ b/pages.json
@@ -292,9 +292,17 @@
       }
     },
     {
-      "path": "pages/lifecycle/component/component",
+      "path": "pages/lifecycle/component/component-options",
       "style": {
-        "navigationBarTitleText": "component-lifecycle"
+        "navigationBarTitleText": "component-lifecycle 选项式 API",
+        "enablePullDownRefresh": true
+      }
+    },
+    {
+      "path": "pages/lifecycle/component/component-composition",
+      "style": {
+        "navigationBarTitleText": "component-lifecycle 组合式 API",
+        "enablePullDownRefresh": true
       }
     },
     {
@@ -759,20 +767,6 @@
         "navigationBarTitleText": "onScopeDispose"
       }
     },
-    {
-      "path": "pages/composition-api/lifecycle/page-lifecycle/page-lifecycle",
-      "style": {
-        "navigationBarTitleText": "页面生命周期",
-        "enablePullDownRefresh": true
-      }
-    },
-    {
-      "path": "pages/composition-api/lifecycle/component-lifecycle/component-lifecycle",
-      "style": {
-        "navigationBarTitleText": "组件生命周期",
-        "enablePullDownRefresh": true
-      }
-    },
     {
       "path": "pages/composition-api/dependency-injection/provide/provide",
       "style": {
diff --git a/pages/composition-api/lifecycle/page-lifecycle/page-lifecycle.test.js b/pages/composition-api/lifecycle/page-lifecycle/page-lifecycle.test.js
deleted file mode 100644
index d250afb..0000000
--- a/pages/composition-api/lifecycle/page-lifecycle/page-lifecycle.test.js
+++ /dev/null
@@ -1,71 +0,0 @@
-const PAGE_PATH = '/pages/composition-api/lifecycle/page-lifecycle/page-lifecycle'
-const HOME_PATH = '/pages/tab-bar/options-api'
-const INTER_PAGE_PATH = '/pages/app-instance/index/index'
-let page
-let lifeCycleNum
-
-describe('page-lifecycle', () => {
-  beforeAll(async () => {
-    page = await program.reLaunch(HOME_PATH)
-    await page.waitFor(700)
-    await page.callMethod('setLifeCycleNum', 0)
-  });
-	afterAll(async () => {
-		const resetLifecycleNum = 1100
-		await page.callMethod('setLifeCycleNum', resetLifecycleNum)
-		lifeCycleNum = await page.callMethod('getLifeCycleNum')
-		expect(lifeCycleNum).toBe(resetLifecycleNum)
-	})
-
-	it('onLoad onShow onReady onResize', async () => {
-		page = await program.reLaunch(PAGE_PATH)
-		await page.waitFor(700)
-		lifeCycleNum = await page.callMethod('getLifeCycleNum')
-		expect(lifeCycleNum).toBe(120)
-		await page.callMethod('pageSetLifeCycleNum', 0)
-	})
-	it('onPullDownRefresh', async () => {
-		await page.callMethod('pullDownRefresh')
-		await page.waitFor(1500)
-		lifeCycleNum = await page.callMethod('getLifeCycleNum')
-		expect(lifeCycleNum).toBe(10)
-		await page.callMethod('pageSetLifeCycleNum', 0)
-	})
-	it('onPageScroll onReachBottom', async () => {
-		await program.pageScrollTo(2000)
-    await page.waitFor(1000)
-		const isScrolled = await page.callMethod('getIsScrolled')
-		expect(isScrolled).toBe(true)
-		lifeCycleNum = await page.callMethod('getLifeCycleNum')
-		expect(lifeCycleNum).toBe(10)
-		await page.callMethod('pageSetLifeCycleNum', 0)
-	})
-	it('onHide', async () => {
-		page = await program.navigateTo(INTER_PAGE_PATH)
-		await page.waitFor('view')
-		lifeCycleNum = await page.callMethod('getLifeCycleNum')
-		expect(lifeCycleNum).toBe(-10)
-		page = await program.navigateBack()
-		await page.waitFor('view')
-		lifeCycleNum = await page.callMethod('getLifeCycleNum')
-		expect(lifeCycleNum).toBe(0)
-	})
-	it('onUnload', async () => {
-		page = await program.reLaunch(HOME_PATH)
-		await page.waitFor(700)
-		lifeCycleNum = await page.callMethod('getLifeCycleNum')
-		expect(lifeCycleNum).toBe(-100)
-		await page.callMethod('setLifeCycleNum', 0)
-	})
-	it('onBackPress', async () => {
-		page = await program.navigateTo(PAGE_PATH)
-		await page.waitFor(700)
-		lifeCycleNum = await page.callMethod('getLifeCycleNum')
-		expect(lifeCycleNum).toBe(120)
-		page = await program.navigateBack()
-		await page.waitFor('view')
-		lifeCycleNum = await page.callMethod('getLifeCycleNum')
-		expect(lifeCycleNum).toBe(10)
-		await page.callMethod('setLifeCycleNum', 0)
-	})
-})
\ No newline at end of file
diff --git a/pages/composition-api/lifecycle/page-lifecycle/page-lifecycle.uvue b/pages/composition-api/lifecycle/page-lifecycle/page-lifecycle.uvue
deleted file mode 100644
index 8a2197e..0000000
--- a/pages/composition-api/lifecycle/page-lifecycle/page-lifecycle.uvue
+++ /dev/null
@@ -1,105 +0,0 @@
-<template>
-  <!-- #ifdef APP -->
-  <scroll-view style="flex:1" :bounces="false">
-  <!-- #endif -->
-    <view class="page container">
-      <text>page lifecycle</text>
-      <button class="uni-common-mt" @click="scrollToBottom">scrollToBottom</button>
-    </view>
-  <!-- #ifdef APP -->
-  </scroll-view>
-  <!-- #endif -->
-</template>
-
-<script setup>
-  import { state, setLifeCycleNum } from '@/store/index.uts'
-  
-  const isScrolled = ref(false)
-  
-  onLoad((_: OnLoadOptions) => {
-    // 自动化测试
-    setLifeCycleNum(state.lifeCycleNum + 100)
-  })
-  onPageShow(() => {
-    // 自动化测试
-    setLifeCycleNum(state.lifeCycleNum + 10)
-  })
-  onReady(() => {
-    // 自动化测试
-    setLifeCycleNum(state.lifeCycleNum + 10)
-  })
-  onPullDownRefresh(() => {
-    // 自动化测试
-    setLifeCycleNum(state.lifeCycleNum + 10)
-  })
-  onPageScroll((_) => {
-    // 自动化测试
-    isScrolled.value = true
-  })
-  onReachBottom(() => {
-    // 自动化测试
-    setLifeCycleNum(state.lifeCycleNum + 10)
-  })
-  onBackPress((_: OnBackPressOptions): boolean | null => {
-    // 自动化测试
-    setLifeCycleNum(state.lifeCycleNum - 10)
-    return null
-  })
-  onPageHide(() => {
-    // 自动化测试
-    setLifeCycleNum(state.lifeCycleNum - 10)
-  })
-  onUnload(() => {
-    // 自动化测试
-    setLifeCycleNum(state.lifeCycleNum - 100)
-  })
-  onResize((_) => {
-    // 自动化测试
-    setLifeCycleNum(state.lifeCycleNum + 10)
-  })
-  
-  // 自动化测试
-  const getLifeCycleNum = () : number => {
-    return state.lifeCycleNum
-  }
-  // 自动化测试
-  const pageSetLifeCycleNum = (num: number) => {
-    setLifeCycleNum(num)
-  }
- 
-  // 自动化测试
-  const pullDownRefresh = () => {
-    uni.startPullDownRefresh({
-      success() {
-        setTimeout(() => {
-          uni.stopPullDownRefresh()
-        }, 1500)
-      },
-    })
-  }
-  
-  const scrollToBottom = () => {
-    uni.pageScrollTo({
-      scrollTop: 2000,
-    })
-  }
-  
-  // 自动化测试
-  const getIsScrolled = (): boolean => {
-    return isScrolled.value
-  }
-  
-  defineExpose({
-    getLifeCycleNum,
-    pageSetLifeCycleNum,
-    pullDownRefresh,
-    scrollToBottom,
-    getIsScrolled
-  })
-</script>
-
-<style>
-  .container {
-    height: 1200px;
-  }
-</style>
\ No newline at end of file
diff --git a/pages/index/index.uvue b/pages/index/index.uvue
index 2ab0f3c..7f996d0 100644
--- a/pages/index/index.uvue
+++ b/pages/index/index.uvue
@@ -4,10 +4,22 @@
     <!-- #endif -->
     <view>
       <uni-collapse>
-        <uni-collapse-item v-for="menu in menus" :key="menu.id" :title="menu.name" class="menu">
+        <uni-collapse-item
+          v-for="menu in menus"
+          :key="menu.id"
+          :title="menu.name"
+          class="menu">
           <view v-for="(page, index) in menu.pages" :key="page.name">
-            <view v-if="page.url" class="page-item" :class="{ 'first-child': index == 0 }" @click="goDetailPage(menu.id, page)">
-              <text :class="{ 'text-disabled': page.enable == false }" class="text">{{ page.name }}</text>
+            <view
+              v-if="page.url"
+              class="page-item"
+              :class="{ 'first-child': index == 0 }"
+              @click="goDetailPage(menu.id, page)">
+              <text
+                :class="{ 'text-disabled': page.enable == false }"
+                class="text"
+                >{{ page.name }}</text
+              >
             </view>
             <template v-if="page.children">
               <uni-collapse style="flex: 1">
@@ -17,9 +29,12 @@
                     :key="child.url"
                     class="page-item"
                     :class="{ 'first-child': index == 0 }"
-                    @click="goDetailPage(`${menu.id}/${page.id}`, child)"
-                  >
-                    <text :class="{ 'text-disabled': child.enable == false }" class="text">{{ child.name }}</text>
+                    @click="goDetailPage(`${menu.id}/${page.id}`, child)">
+                    <text
+                      :class="{ 'text-disabled': child.enable == false }"
+                      class="text"
+                      >{{ child.name }}</text
+                    >
                   </view>
                 </uni-collapse-item>
               </uni-collapse>
@@ -303,6 +318,22 @@ export default {
                   url: 'page-composition'
                 }
               ]
+            }, {
+              id: 'component',
+              name: '组件生命周期',
+              children: [
+                {
+                  id: 'component-options',
+                  name: '组件生命周期 选项式 API',
+                  url: 'component-options'
+                },
+
+                {
+                  id: 'component-composition',
+                  name: '组件生命周期 组合式 API',
+                  url: 'component-composition'
+                }
+              ]
             }
           ] as Page[]
         },
@@ -510,4 +541,4 @@ export default {
     }
   }
 }
-</style>
\ No newline at end of file
+</style>
diff --git a/pages/lifecycle/component/ChildComponentComposition.uvue b/pages/lifecycle/component/ChildComponentComposition.uvue
new file mode 100644
index 0000000..02fc397
--- /dev/null
+++ b/pages/lifecycle/component/ChildComponentComposition.uvue
@@ -0,0 +1,101 @@
+<template>
+  title: {{ title }}
+  <button class="component-lifecycle-btn mt-10" @click="updateTitle">
+    updateTitle
+  </button>
+</template>
+
+<script setup lang='uts'>
+import { state, setLifeCycleNum } from '@/store/index.uts'
+
+const title = ref('component for composition API lifecycle test')
+
+const emit = defineEmits<{
+  (e : 'updateIsScroll', val : boolean) : void
+}>()
+
+onLoad((_ : OnLoadOptions) => {
+  // 自动化测试
+  setLifeCycleNum(state.lifeCycleNum + 100)
+})
+onPageShow(() => {
+  // 自动化测试
+  setLifeCycleNum(state.lifeCycleNum + 10)
+})
+onReady(() => {
+  // 自动化测试
+  // TODO: onReady 未触发
+  setLifeCycleNum(state.lifeCycleNum + 10)
+})
+
+onPullDownRefresh(() => {
+  // 自动化测试
+  setLifeCycleNum(state.lifeCycleNum + 10)
+})
+onPageScroll((_) => {
+  // 自动化测试
+  emit('updateIsScroll', true)
+})
+onReachBottom(() => {
+  // 自动化测试
+  setLifeCycleNum(state.lifeCycleNum + 10)
+})
+onBackPress((_ : OnBackPressOptions) : boolean | null => {
+  // 自动化测试
+  setLifeCycleNum(state.lifeCycleNum - 10)
+  return null
+})
+onPageHide(() => {
+  // 自动化测试
+  setLifeCycleNum(state.lifeCycleNum - 10)
+})
+onUnload(() => {
+  // 自动化测试
+  setLifeCycleNum(state.lifeCycleNum - 100)
+})
+
+onBeforeMount(() => {
+  // 自动化测试
+  setLifeCycleNum(state.lifeCycleNum + 1)
+  console.log('component for lifecycle test mounted')
+})
+
+onMounted(() => {
+  // 自动化测试
+  setLifeCycleNum(state.lifeCycleNum + 1)
+  console.log('component for lifecycle test mounted')
+})
+
+onBeforeUpdate(() => {
+  // 自动化测试
+  setLifeCycleNum(state.lifeCycleNum + 1)
+  console.log('component for lifecycle test beforeUpdate')
+})
+
+onUpdated(() => {
+  // 自动化测试
+  setLifeCycleNum(state.lifeCycleNum + 1)
+  console.log('component for lifecycle test updated')
+})
+
+onBeforeUnmount(() => {
+  // 自动化测试
+  setLifeCycleNum(state.lifeCycleNum - 1)
+  console.log('component for lifecycle test beforeUnmount')
+})
+
+onUnmounted(() => {
+  // 自动化测试
+  setLifeCycleNum(state.lifeCycleNum - 1)
+  console.log('component for lifecycle test unmounted')
+})
+
+// TODO: app-android 不触发
+onActivated(() => { })
+// TODO: app-android 不触发
+onDeactivated(() => { })
+
+const updateTitle = () => {
+  title.value = 'component for lifecycle test updated'
+}
+</script>
diff --git a/components/OptionsAPILifecycle.uvue b/pages/lifecycle/component/ChildComponentOptions.uvue
similarity index 87%
rename from components/OptionsAPILifecycle.uvue
rename to pages/lifecycle/component/ChildComponentOptions.uvue
index 9a1e385..9e42bf6 100644
--- a/components/OptionsAPILifecycle.uvue
+++ b/pages/lifecycle/component/ChildComponentOptions.uvue
@@ -1,12 +1,12 @@
 <template>
   title: {{ title }}
-  <button class="component-lifecycle-btn uni-common-mt" @click="updateTitle">
+  <button class="component-lifecycle-btn mt-10" @click="updateTitle">
     updateTitle
   </button>
 </template>
 
-<script>
-  import { state, setLifeCycleNum } from '../store/index.uts';
+<script lang='uts'>
+  import { state, setLifeCycleNum } from '@/store/index.uts';
   export default {
     name: 'OptionsAPIComponentLifecycle',
     data() {
diff --git a/pages/composition-api/lifecycle/component-lifecycle/component-lifecycle.test.js b/pages/lifecycle/component/component-composition.test.js
similarity index 68%
rename from pages/composition-api/lifecycle/component-lifecycle/component-lifecycle.test.js
rename to pages/lifecycle/component/component-composition.test.js
index 5cb18a7..ac126f2 100644
--- a/pages/composition-api/lifecycle/component-lifecycle/component-lifecycle.test.js
+++ b/pages/lifecycle/component/component-composition.test.js
@@ -1,6 +1,5 @@
-const PAGE_PATH = '/pages/composition-api/lifecycle/component-lifecycle/component-lifecycle'
-const INTER_PAGE_PATH = '/pages/app-instance/index/index'
-const HOME_PATH = '/pages/tab-bar/options-api'
+const PAGE_PATH = '/pages/lifecycle/component/component-composition'
+const HOME_PATH = '/pages/index/index'
 
 describe('component-lifecycle', () => {
   let page
@@ -24,23 +23,23 @@ describe('component-lifecycle', () => {
   })
 
   it('onLoad onPageShow onReady onBeforeMount onMounted', async () => {
-    lifeCycleNum = await page.callMethod('getLifeCycleNum')
+    lifeCycleNum = await page.callMethod('pageGetLifeCycleNum')
     expect(lifeCycleNum).toBe(112)
-    await page.callMethod('pageSetlifeCycleNum', 0)
+    await page.callMethod('pageSetLifeCycleNum', 0)
   })
   it('onBeforeUpdate onUpdated', async () => {
     const updateTitleBtn = await page.$('.component-lifecycle-btn')
     await updateTitleBtn.tap()
-    lifeCycleNum = await page.callMethod('getLifeCycleNum')
+    lifeCycleNum = await page.callMethod('pageGetLifeCycleNum')
     expect(lifeCycleNum).toBe(2)
-    await page.callMethod('pageSetlifeCycleNum', 0)
+    await page.callMethod('pageSetLifeCycleNum', 0)
   })
   it('onPullDownRefresh', async () => {
     await page.callMethod('pullDownRefresh')
-    await page.waitFor(1500)
-    lifeCycleNum = await page.callMethod('getLifeCycleNum')
+    await page.waitFor(2000)
+    lifeCycleNum = await page.callMethod('pageGetLifeCycleNum')
     expect(lifeCycleNum).toBe(10)
-    await page.callMethod('pageSetlifeCycleNum', 0)
+    await page.callMethod('pageSetLifeCycleNum', 0)
   })
   it('onPageScroll onReachBottom', async () => {
     await program.pageScrollTo(2000)
@@ -48,21 +47,21 @@ describe('component-lifecycle', () => {
     if (process.env.uniTestPlatformInfo.startsWith('android')) {
       const isScrolled = await page.callMethod('getIsScrolled')
       expect(isScrolled).toBe(true)
-      lifeCycleNum = await page.callMethod('getLifeCycleNum')
+      lifeCycleNum = await page.callMethod('pageGetLifeCycleNum')
       expect(lifeCycleNum).toBe(10)
     }
-    await page.callMethod('pageSetlifeCycleNum', 0)
+    await page.callMethod('pageSetLifeCycleNum', 0)
   })
   it('onHide', async () => {
-    page = await program.navigateTo(INTER_PAGE_PATH)
+    page = await program.navigateTo(HOME_PATH)
     await page.waitFor('view')
     lifeCycleNum = await page.callMethod('getLifeCycleNum')
     expect(lifeCycleNum).toBe(-10)
     page = await program.navigateBack()
     await page.waitFor('view')
-    lifeCycleNum = await page.callMethod('getLifeCycleNum')
+    lifeCycleNum = await page.callMethod('pageGetLifeCycleNum')
     expect(lifeCycleNum).toBe(0)
-    await page.callMethod('pageSetlifeCycleNum', 0)
+    await page.callMethod('pageSetLifeCycleNum', 0)
   })
   it('beforeUnmount unmounted onUnload onBackPress', async () => {
     page = await program.navigateBack()
diff --git a/pages/composition-api/lifecycle/component-lifecycle/component-lifecycle.uvue b/pages/lifecycle/component/component-composition.uvue
similarity index 62%
rename from pages/composition-api/lifecycle/component-lifecycle/component-lifecycle.uvue
rename to pages/lifecycle/component/component-composition.uvue
index b850f25..f33439a 100644
--- a/pages/composition-api/lifecycle/component-lifecycle/component-lifecycle.uvue
+++ b/pages/lifecycle/component/component-composition.uvue
@@ -2,29 +2,29 @@
   <!-- #ifdef APP -->
   <scroll-view style="flex:1">
   <!-- #endif -->
-    <view class="pag container">
-      <text class="uni-common-mb">component lifecycle</text>
-      <component-lifecycle class="component-lifecycle" @updateIsScroll="updateIsScroll" />
-      <button class="uni-common-mt" @click="scrollToBottom">scrollToBottom</button>
+    <view class="page container">
+      <text class="mb-10">component lifecycle 组合式 API</text>
+      <child-component @updateIsScroll="updateIsScroll" />
+      <button class="mt-10" @click="scrollToBottom">scrollToBottom</button>
     </view>
   <!-- #ifdef APP -->
   </scroll-view>
   <!-- #endif -->
 </template>
 
-<script setup>
-  import ComponentLifecycle from '@/components/CompositionAPILifecycle.uvue'
+<script setup lang='uts'>
+  import ChildComponent from './ChildComponentComposition.uvue'
   import { state, setLifeCycleNum } from '@/store/index.uts'
 
   const isScrolled = ref(false)
 
   // 自动化测试
-  const getLifeCycleNum = () : number => {
+  const pageGetLifeCycleNum = () : number => {
     return state.lifeCycleNum
   }
 
   // 自动化测试
-  const pageSetlifeCycleNum = (num : number) => {
+  const pageSetLifeCycleNum = (num : number) => {
     setLifeCycleNum(num)
   }
 
@@ -55,8 +55,8 @@
   }
 
   defineExpose({
-    getLifeCycleNum,
-    pageSetlifeCycleNum,
+    pageGetLifeCycleNum,
+    pageSetLifeCycleNum,
     pullDownRefresh,
     scrollToBottom,
     getIsScrolled
diff --git a/pages/lifecycle/component/component.test.js b/pages/lifecycle/component/component-options.test.js
similarity index 89%
rename from pages/lifecycle/component/component.test.js
rename to pages/lifecycle/component/component-options.test.js
index 7b67399..4bce040 100644
--- a/pages/lifecycle/component/component.test.js
+++ b/pages/lifecycle/component/component-options.test.js
@@ -1,5 +1,5 @@
-const PAGE_PATH = '/pages/lifecycle/component/component'
-const HOME_PATH = '/pages/tab-bar/options-api'
+const PAGE_PATH = '/pages/lifecycle/component/component-options'
+const HOME_PATH = '/pages/index/index'
 
 describe('component-lifecycle', () => {
 	let page
diff --git a/pages/lifecycle/component/component.uvue b/pages/lifecycle/component/component-options.uvue
similarity index 50%
rename from pages/lifecycle/component/component.uvue
rename to pages/lifecycle/component/component-options.uvue
index 25ce719..40ee6d2 100644
--- a/pages/lifecycle/component/component.uvue
+++ b/pages/lifecycle/component/component-options.uvue
@@ -1,20 +1,21 @@
-<template>
-  <view class="page">
-    <text class="uni-common-mb">component lifecycle</text>
-    <component-lifecycle class="component-lifecycle" />
-  </view>
-</template>
-
-<script>
-import ComponentLifecycle from '@/components/OptionsAPILifecycle.uvue'
-import { state } from '@/store/index.uts'
-export default {
-  components: { ComponentLifecycle },
-  methods: {
-    // 自动化测试
-    getLifeCycleNum(): number {
-      return state.lifeCycleNum
-    },
-  },
-}
-</script>
+<template>
+  <view class="page">
+    <text class="mb-10">component lifecycle 选项式 API</text>
+    <child-component />
+  </view>
+</template>
+
+<script lang='uts'>
+import ChildComponent from './ChildComponentOptions.uvue'
+import { state } from '@/store/index.uts'
+
+export default {
+  components: { ChildComponent },
+  methods: {
+    // 自动化测试
+    getLifeCycleNum(): number {
+      return state.lifeCycleNum
+    },
+  },
+}
+</script>
diff --git a/pages/lifecycle/page/page-composition.uvue b/pages/lifecycle/page/page-composition.uvue
index 7180fd9..50777e2 100644
--- a/pages/lifecycle/page/page-composition.uvue
+++ b/pages/lifecycle/page/page-composition.uvue
@@ -3,7 +3,7 @@
   <scroll-view style="flex: 1" :bounces="false">
   <!-- #endif -->
     <view class="page container">
-      <text>page lifecycle</text>
+      <text>page lifecycle 组合式 API</text>
       <button class="mt-10" @click="scrollToBottom">
         scrollToBottom
       </button>
@@ -18,11 +18,11 @@
   type DataInfo = {
     isScrolled : boolean
   }
-  const dataInfo = reactive({
-    isScrolled: false,
+  const dataInfo = reactive({
+    isScrolled: false,
   } as DataInfo)
 
-  onLoad((_ : OnLoadOptions) => {
+  onLoad((_ : OnLoadOptions) => {
     // 自动化测试
     setLifeCycleNum(state.lifeCycleNum + 100)
   })
@@ -39,7 +39,7 @@
     setLifeCycleNum(state.lifeCycleNum + 10)
   })
   onPageScroll((_) => {
-    // 自动化测试
+    // 自动化测试
     dataInfo.isScrolled = true
   })
   onReachBottom(() => {
@@ -65,9 +65,9 @@
   })
 
   // 自动化测试
-  const pageGetLifeCycleNum = () : number => {
+  const pageGetLifeCycleNum = () : number => {
     return state.lifeCycleNum
-  }
+  }
   // 自动化测试
   const pageSetLifeCycleNum = (num : number) => {
     setLifeCycleNum(num)
@@ -90,7 +90,7 @@
     })
   }
 
-  defineExpose({
+  defineExpose({
     dataInfo,
     pageGetLifeCycleNum,
     pageSetLifeCycleNum,
diff --git a/pages/lifecycle/page/page-options.uvue b/pages/lifecycle/page/page-options.uvue
index f5e0793..07c9ecb 100644
--- a/pages/lifecycle/page/page-options.uvue
+++ b/pages/lifecycle/page/page-options.uvue
@@ -3,7 +3,7 @@
 	<scroll-view style="flex: 1" :bounces="false">
 	<!-- #endif -->
 		<view class="page container">
-			<text>page lifecycle</text>
+			<text>page lifecycle 选项式 API</text>
 			<button class="mt-10" @click="scrollToBottom">scrollToBottom</button>
 		</view>
 	<!-- #ifdef APP -->
-- 
GitLab