小程序（uniapp）页面的跳转方式有哪些，他们之间的区别是什么？-Toy模板网

这篇具有很好参考价值的文章主要介绍了小程序（uniapp）页面的跳转方式有哪些，他们之间的区别是什么？。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

1、uni.navigateTo: 保留当前页面，跳转到应用的某个页面，使用 uni.navigateBack 可以返回原页面。这种方式类似于网页的超链接跳转。

2、uni.redirectTo: 关闭当前页面，跳转大应用内的某个页面。这种方式类似于网页的重定向。

3、uni.switchTab: 跳转到tabBar页面，并关闭其他所有非tabBar页面。

4、uni.reLaunch: 关闭所有页面，打开到应用内的某个页面。

5、nui.navigateBack: 关闭当前页面，返回上一页或多级页面。

这些跳转方式的主要区别在于他们对页面栈的处理方式不同。uni.navigateTo 会将新页面压入页面栈，而 uni.redirectTo 则不会打开新的页面，而 switchTab 和 reLaunch 、

uni.switchTab 和 uni.reLaunch 则会关闭当前页面。uni.navigateBack 则会从页面栈中弹出当前页面，返回到上一页面或多级页面。

以下是这些跳转方式的代码示例：

// uni.navigateTo
uni.navigateTo({
	url: '/pages/example/example'
});

// uni.redirectTo
uni.redirectTo({
	url: '/pages/example/example'
});

// uni.switchTab
uni.switchTab({
	url: '/pages/example/example'
});

// uni.reLaunch
uni.reLaunch({
	url: '/pages/example/example'
});

// uni.navigateBack
uni.navigateBack({
	delta: 1
});

在使用这些跳转方式时，需要注意以下几点：

1、页面栈最大深度为10，当超过10时，需要使用 uni.redirectTo 或 uni.reLaunch。

2、uni.switchTab 只能用于跳转到 tabBar 页面，不能指定参数。

3、uni.reLaunch 可以关闭所有页面，包括 tabBar 页面。

4、uni.navigateTo 和 uni.redirectTo 的跳转方式都可以指定参数。参数可以通过 URL 的查询字符串（query string）来传递。

以下是使用 uni.navigateTo 和 uni.redirectTo 指定参数的代码示例：

// uni.navigateTo
uni.navigateTo({
  url: '/pages/example/example?param1=value1&param2=value2'
});

// uni.redirectTo
uni.redirectTo({
  url: '/pages/example/example?param1=value1&param2=value2'
});

在上述示例中，我们通过查询字符串 ?param1=value1¶m2=value2 将参数 param1 和 param2 传递给目标页面。在目标页面中，我们可以通过 this.$route.query 来获取这些参数。文章来源地址https://www.toymoban.com/news/detail-514262.html

到了这里，关于小程序（uniapp）页面的跳转方式有哪些，他们之间的区别是什么？的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！