uni-app微信小程序页面跳转技巧总结
在小程序开发中，页面跳转是高频操作，但如果不注意跳转方式，可能会遇到跳转失效的问题！以下是常见跳转方式及其适用场景：
-
uni.navigateTo- 保留当前页面，跳转到新页面。
- 注意：小程序中页面栈最多 10 层，频繁跳转会失效。
- 适用场景：需要保留当前页面的跳转，适合层级较少的页面跳转。
-
uni.redirectTo- 关闭当前页面，跳转到新页面。
- 适用场景：不相关的页面跳转，避免页面栈堆积。
-
uni.reLaunch- 关闭所有页面，打开新页面。
- 适用场景：重置页面栈，适合重新加载整个应用。
-
uni.switchTab- 跳转到
tabBar页面，关闭其他非tabBar页面。 - 适用场景：切换底部导航栏页面。
- 跳转到
-
uni.navigateBack- 返回上一页面或多级页面。
- 适用场景：返回操作。
常见问题及解决方案
-
跳转失效
- 原因：
uni.navigateTo跳转次数过多，页面栈达到 10 层限制。 - 解决：使用
uni.redirectTo或uni.reLaunch替代。
- 原因：
-
返回到指定页面
- 使用
uni.switchTab或uni.reLaunch实现。 - 示例代码
- 使用
onBackPress(event) {
uni.switchTab({
url: '/pages/tab/my/my'
});
return true;
}
总结
- 层级跳转：优先使用
uni.navigateTo，但注意页面栈限制。 - 不相关页面跳转：使用
uni.redirectTo避免页面栈堆积。 - 重置页面栈：使用
uni.reLaunch或uni.switchTab。