uniapp隐藏当前页面不关闭-猿码集

1. 什么是uniapp？

Uniapp是一个开发跨平台应用程序的框架。使用Uniapp框架可以轻松构建一次编译多平台的应用程序，如微信小程序、H5、iOS和Android。开发人员只需使用一种语言和组件库就可以轻松构建跨平台应用程序。

在uniapp中，可以使用以下两种方式实现页面间的跳转：

使用uniapp内置的API：uni.navigateTo、uni.redirectTo、uni.reLaunch、uni.switchTab

使用vue-router的方式：使用vue-router插件来管理页面跳转

其中，uni.navigateTo实现的是页面跳转，跳转后会保留当前页面；uni.redirectTo实现的是重定向，跳转后不会保留当前页面；uni.reLaunch实现的是关闭所有页面，打开到应用内的某个页面；uni.switchTab实现的是切换选项卡。

使用uniapp内置的API uni.navigateTo可以实现跳转到下一个页面并隐藏当前页面，但是跳转后当前页面并没有关闭。例如：


// index.vue页面
uni.navigateTo({
  url: '/pages/other/other'
})

上述代码实现了跳转到other.vue页面，并隐藏当前页面index.vue，但是index.vue并没有关闭。

如果需要在跳转时关闭当前页面，可以在跳转后手动执行uni.navigateBack方法，如下：


// index.vue页面
uni.navigateTo({
  url: '/pages/other/other',
  success() {
    uni.navigateBack({ delta: 1 })
  }
})

上述代码实现了跳转到other.vue页面，并在跳转后关闭当前页面index.vue。

使用uni.navigateTo跳转页面时，需要在路由配置文件（如/main.js）中配置路由规则。

如果需要传递数据给下一个页面，可以在跳转时传递参数，如uni.navigateTo({ url: '/pages/other/other?param1=value1' })，在other.vue页面可以通过this.$route.query.param1获取传递的参数值。

如果使用vue-router插件来管理页面跳转，可以使用this.$router.push实现页面跳转，使用this.$router.replace实现重定向，使用this.$router.back实现返回。

通过使用uniapp内置的API uni.navigateTo实现跳转后隐藏当前页面，在跳转后手动执行uni.navigateBack方法可关闭当前页面。需要注意的是，使用uni.navigateTo跳转页面时需要在路由配置文件中配置路由规则，如有需要可以传递数据给下一个页面。