Uniapp页面跳转后代码还会执行吗?
Uniapp页面跳转与代码执行
在Uniapp中,使用uni.navigateTo()或uni.redirectTo()等API跳转页面后,跳转方法后面的代码仍然会继续执行。
这是因为Uniapp的页面跳转是异步操作。
- 当调用
uni.navigateTo()或uni.redirectTo()等方法时,Uniapp会立即发起页面跳转,同时方法本身会立即返回,不会等待新页面加载完成。 - 因此,跳转方法后面的代码会继续执行,而不会被阻塞。
以下示例代码演示了这一行为:
console.log('开始跳转页面');
uni.navigateTo({
url: '/pages/otherPage'
});
console.log('跳转完成');
// otherPage.vue
<template>
<view>
<text>其他页面</text>
</view>
</template>
运行这段代码,你会发现控制台会依次打印'开始跳转页面'和'跳转完成',然后才会跳转到otherPage页面。
页面跳转后的逻辑处理
如果需要在页面跳转后执行一些操作,可以通过以下方法实现:
-
在目标页面的生命周期钩子中处理
onLoad:页面加载时触发onShow:页面显示时触发
在
otherPage.vue的onLoad或onShow生命周期钩子中添加相关逻辑,即可在页面跳转后执行特定操作。 -
使用回调函数
某些跳转API,例如
uni.navigateTo,支持传入success、fail、complete等回调函数,可以在页面跳转成功、失败或完成后执行相应的逻辑。uni.navigateTo({ url: '/pages/otherPage', success: () => { console.log('页面跳转成功'); } });
通过以上方法,可以方便地在Uniapp中处理页面跳转前后的逻辑。
原文地址: https://www.cveoy.top/t/topic/b9JL 著作权归作者所有。请勿转载和采集!