提交 fdeb9f2d 编写于 作者: W wanganxp

修复页面路由示例的一些bug,补充页面生命周期示例

上级 e5172005
<template> <template>
<view> <view>
<page-head :title="title"></page-head> <page-head title="navigate"></page-head>
<view class="uni-padding-wrap uni-common-mt"> <view class="uni-padding-wrap uni-common-mt">
<view style="flex-direction: row;">
<text style="width: 170px; ">onLoad触发时间戳:</text>
<text style="text-align: right">{{onLoadTime}}</text>
</view>
<view style="flex-direction: row;">
<text style="width: 170px; ">onReady触发时间戳:</text>
<text style="text-align: right">{{onReadyTime}}</text>
</view>
<view style="flex-direction: row;">
<text style="width: 170px; ">onUnload触发时间戳:</text>
<text style="text-align: right">退出页面时见控制台</text>
</view>
<view style="flex-direction: row;">
<text style="width: 170px; ">onShow触发时间戳:</text>
<text style="text-align: right">{{onShowTime}}</text>
</view>
<view style="flex-direction: row;">
<text style="width: 170px; ">onHide触发时间戳:</text>
<text style="text-align: right">{{onHideTime}}</text>
</view>
<view class="uni-btn-v"> <view class="uni-btn-v">
<button @tap="navigateTo" class="uni-btn">跳转新页面,并传递数据</button> <button @tap="navigateTo" class="uni-btn">跳转新页面,并传递数据</button>
<button @tap="navigateBack" class="uni-btn">返回上一页</button> <button @tap="navigateBack" class="uni-btn">返回上一页</button>
<button @tap="redirectTo" class="uni-btn">在当前页面打开</button> <button @tap="redirectTo" class="uni-btn">在当前页面打开</button>
<!-- <button @tap="switchTab" class="uni-btn">切换到模板选项卡</button> --> <button @tap="switchTab" class="uni-btn">切换到模板选项卡</button>
<button @tap="reLaunch" class="uni-btn">关闭所有页面,打开首页</button> <button @tap="reLaunch" class="uni-btn">关闭所有页面,打开首页</button>
<!-- #ifdef APP-PLUS -->
<button @tap="customAnimation" class="uni-btn">使用自定义动画打开页面</button> <button @tap="customAnimation" class="uni-btn">使用自定义动画打开页面</button>
<!-- #endif -->
<!-- #ifdef APP-PLUS || H5 -->
<button @tap="preloadPage" class="uni-btn">预载复杂页面</button>
<!-- #endif -->
<!-- #ifdef APP-PLUS -->
<button @tap="unPreloadPage" class="uni-btn">取消页面预载</button>
<!-- #endif -->
<!-- #ifdef APP-PLUS || H5 -->
<!-- <button @tap="navigateToPreloadPage" class="uni-btn">打开复杂页面</button> -->
<!-- #endif -->
</view> </view>
</view> </view>
</view> </view>
</template> </template>
<script lang="ts"> <script lang="ts">
const preloadPageUrl = '/pages/extUI/calendar/calendar'
export default { export default {
data() { data() {
return { return {
title: 'navigate' onLoadTime:0,
onShowTime:0,
onReadyTime:0,
onHideTime:0,
} }
}, },
onLoad() {
this.onLoadTime = Date.now();
console.log("onLoad",this.onLoadTime);
},
onShow() {
this.onShowTime = Date.now();
console.log("onShow",this.onShowTime);
},
onReady() {
this.onReadyTime = Date.now();
console.log("onReady",this.onReadyTime);
},
onHide() {
this.onHideTime = Date.now();
console.log("onHide",Date.now());
},
onUnload() {
console.log("onUnLoad",Date.now());
},
methods: { methods: {
navigateTo() { navigateTo() {
uni.navigateTo({ uni.navigateTo({
...@@ -50,18 +81,12 @@ ...@@ -50,18 +81,12 @@
}, },
switchTab() { switchTab() {
uni.switchTab({ uni.switchTab({
url: '/pages/tabBar/template/template' url: '/pages/tabBar/template'
}); });
}, },
reLaunch() { reLaunch() {
// if (this.hasLeftWin) {
// uni.reLaunch({
// url: '/pages/component/view/view'
// });
// return;
// }
uni.reLaunch({ uni.reLaunch({
url: '/pages/tabBar/component/component' url: '/pages/tabBar/component'
}); });
}, },
customAnimation() { customAnimation() {
...@@ -70,39 +95,6 @@ ...@@ -70,39 +95,6 @@
animationType: 'slide-in-bottom', animationType: 'slide-in-bottom',
animationDuration: 200 animationDuration: 200
}) })
},
preloadPage() {
uni.showToast({
icon: 'none',
title: '暂不支持'
})
// uni.preloadPage({
// url: preloadPageUrl,
// success(){
// uni.showToast({
// title:'页面预载成功'
// })
// },
// fail(){
// uni.showToast({
// title:'页面预载失败'
// })
// }
// })
},
unPreloadPage() {
uni.showToast({
icon: 'none',
title: '暂不支持'
})
// uni.unPreloadPage({
// url: preloadPageUrl
// })
},
navigateToPreloadPage() {
uni.navigateTo({
url: preloadPageUrl
})
} }
} }
} }
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册