feat: 补充 onBackPress 示例及测试

pages.json

@@ -624,6 +624,30 @@
         "enablePullDownRefresh": true
       }
     },
+    {
+      "path": "pages/lifecycle/page/onBackPress/on-back-press-options",
+      "style": {
+        "navigationBarTitleText": "onBackPress 选项式 API"
+      }
+    },
+    {
+      "path": "pages/lifecycle/page/onBackPress/on-back-press-child-options",
+      "style": {
+        "navigationBarTitleText": "onBackPress 选项式 API"
+      }
+    },
+    {
+      "path": "pages/lifecycle/page/onBackPress/on-back-press-composition",
+      "style": {
+        "navigationBarTitleText": "onBackPress 组合式 API"
+      }
+    },
+    {
+      "path": "pages/lifecycle/page/onBackPress/on-back-press-child-composition",
+      "style": {
+        "navigationBarTitleText": "onBackPress 组合式 API"
+      }
+    },
     {
       "path": "pages/lifecycle/component/component-options",
       "style": {

pages/lifecycle/page/onBackPress/on-back-press-child-composition.uvue

+<template>
+  <view class="page container">
+    <text>测试 onBackPress 生命周期返回 false</text>
+  </view>
+</template>
+
+<script lang='uts' setup>
+  onBackPress((options: OnBackPressOptions): boolean | null => {
+    console.log('onBackPress', options)
+    return false
+  })
+</script>
\ No newline at end of file

pages/lifecycle/page/onBackPress/on-back-press-child-options.uvue

+<template>
+  <view class="page container">
+    <text>测试 onBackPress 生命周期返回 false</text>
+  </view>
+</template>
+
+<script lang='uts'>
+  export default {
+    onBackPress(options: OnBackPressOptions): boolean | null {
+      console.log('onBackPress', options)
+      return false
+    }
+  }
+</script>
\ No newline at end of file

pages/lifecycle/page/onBackPress/on-back-press-composition.uvue

+<template>
+  <view class="page container">
+    <text>测试 onBackPress 生命周期返回 true</text>
+    <button class="mt-10" @click="goChildPage">
+      跳转子页，测试返回值为 false
+    </button>
+  </view>
+</template>
+
+<script lang="uts" setup>
+  const backPressOptions = reactive({
+    from: 'backbutton'
+  } as OnBackPressOptions)
+
+  onBackPress((options : OnBackPressOptions) : boolean | null => {
+    console.log('onBackPress', options)
+    backPressOptions.from = options.from
+    return true
+  })
+  const goChildPage = () => {
+    uni.navigateTo({ url: '/pages/lifecycle/page/onBackPress/on-back-press-child-composition' })
+  }
+
+  defineExpose({
+    goChildPage,
+    backPressOptions
+  })
+</script>
\ No newline at end of file

pages/lifecycle/page/onBackPress/on-back-press-options.uvue

+<template>
+  <view class="page container">
+    <text>测试 onBackPress 生命周期返回 true</text>
+    <button class='mt-10' @click="goChildPage">跳转子页，测试返回值为 false</button>
+  </view>
+</template>
+
+<script lang='uts'>
+  export default {
+    data() {
+      return {
+        backPressOptions: {
+          from: 'backbutton'
+        } as OnBackPressOptions
+      }
+    },
+    onBackPress(options: OnBackPressOptions): boolean | null {
+      console.log('onBackPress', options)
+      this.backPressOptions = options
+      return true
+    },
+    methods: {
+      goChildPage() {
+        uni.navigateTo({
+          url: '/pages/lifecycle/page/onBackPress/on-back-press-child-options'
+        })
+      }
+    }
+  }
+</script>
\ No newline at end of file

pages/lifecycle/page/onBackPress/on-back-press.test.js

+jest.setTimeout(30000)
+const OPTIONS_PAGE_PATH = '/pages/lifecycle/page/onBackPress/on-back-press-options'
+const OPTIONS_CHILD_PAGE_PATH = '/pages/lifecycle/page/onBackPress/on-back-press-child-options'
+const COMPOSITION_PAGE_PATH = '/pages/lifecycle/page/onBackPress/on-back-press-composition'
+const COMPOSITION_CHILD_PAGE_PATH = '/pages/lifecycle/page/onBackPress/on-back-press-child-composition'
+
+describe('onBackPress 返回值', () => {
+  const test = async (pagePath, childPagePath) => {
+    const page = await program.navigateTo(pagePath)
+    await page.waitFor('view')
+    expect(page.path).toBe(pagePath.substring(1))
+    await page.callMethod('goChildPage')
+    await page.waitFor(800)
+    const childPage = await program.currentPage()
+    await childPage.waitFor('view')
+    expect(childPage.path).toBe(childPagePath.substring(1))
+    await program.navigateBack()
+    let currentPage = await program.currentPage()
+    expect(currentPage.path).toBe(pagePath.substring(1))
+    await program.navigateBack()
+    currentPage = await program.currentPage()
+    expect(currentPage.path).toBe(pagePath.substring(1))
+    const currentPageData = await currentPage.data('backPressOptions')
+    expect(currentPageData.from).toBe('navigateBack')
+
+  }
+  it('onBackPress options API', async () => {
+    await test(OPTIONS_PAGE_PATH, OPTIONS_CHILD_PAGE_PATH)
+  })
+
+  it('onBackPress composition API', async () => {
+    await test(COMPOSITION_PAGE_PATH, COMPOSITION_CHILD_PAGE_PATH)
+  })
+});
\ No newline at end of file

pages/lifecycle/page/page-composition.uvue

@@ -35,14 +35,17 @@
       <view class="flex flex-row justify-between mt-10">
         <text>onResize 触发：</text>
         <text>{{ isOnResizeTriggered }}</text>
-      </view>
-			<view class="flex flex-row justify-between mt-10">
-				<MonitorPageLifecycleComposition />
+      </view>
+      <view class="flex flex-row justify-between mt-10">
+        <MonitorPageLifecycleComposition />
       </view>
       <button class="mt-10" @click="scrollToBottom">scrollToBottom</button>
       <button class="mt-10" @click="pullDownRefresh">
         trigger pullDownRefresh
       </button>
+      <button class="mt-10" @click="goOnBackPress">
+        跳转 onBackPress 示例
+      </button>
     </view>
     <!-- #ifdef APP -->
   </scroll-view>
@@ -50,7 +53,7 @@
 </template>
 
 <script setup lang="uts">
-import { state, setLifeCycleNum } from '@/store/index.uts'
+import { state, setLifeCycleNum } from '@/store/index.uts'
 import MonitorPageLifecycleComposition from './monitor-page-lifecycle-composition.uvue'
 
 const isOnloadTriggered = ref(false)
@@ -151,6 +154,10 @@ const scrollToBottom = () => {
   })
 }
 
+const goOnBackPress = () => {
+  uni.navigateTo({url: '/pages/lifecycle/page/onBackPress/on-back-press-composition'})
+}
+
 defineExpose({
   dataInfo,
   pageGetLifeCycleNum,

pages/lifecycle/page/page-options.uvue

@@ -40,6 +40,9 @@
       <button class="mt-10" @click="scrollToBottom">scrollToBottom</button>
       <button class="mt-10" @click="pullDownRefresh">
         trigger pullDownRefresh
+      </button>
+			<button class="mt-10" @click="goOnBackPress">
+        跳转 onBackPress 示例
       </button>
     </view>
     <!-- #ifdef APP -->
@@ -150,6 +153,9 @@ export default {
 				scrollTop: 2000,
 			})
 		},
+		goOnBackPress() {
+			uni.navigateTo({url: '/pages/lifecycle/page/onBackPress/on-back-press-options'})
+		}
 	},
 }
 </script>