uniapp怎么关闭当前页面？常见方法介绍

1. uniapp关闭当前页面的常见方法介绍

在uniapp中，关闭当前页面是实现一些操作的必备步骤，比如返回上一页、提交表单或者关闭模态框等等。本篇文章将介绍uniapp中常用的几种关闭当前页面的方法。

1.1 uni.navigateBack()

uni.navigateBack()是用来关闭当前页面并返回上一页的方法。该方法包含一个参数delta，表示返回的页面层数，delta的默认值为1。

// 关闭当前页面并返回上一页
uni.navigateBack({
  delta: 1
})

注意：使用该方法需要在uni-app的manifest.json文件中对pages配置进行相应的操作。

1.2 uni.redirectTo()

uni.redirectTo()是用来关闭当前页面并跳转到应用中的某个页面的方法，该方法会将当前页面从页面栈中移除，并且不允许用户返回到该页面。

// 关闭当前页面并跳转到应用中的某个页面
uni.redirectTo({
  url: '/pages/index/index'
})

1.3 uni.reLaunch()

uni.reLaunch()是用来关闭所有页面并跳转到应用中的某个页面的方法，该方法会将页面栈中的所有页面移除。

// 关闭所有页面并跳转到应用中的某个页面
uni.reLaunch({
  url: '/pages/index/index'
})

1.4 uni.navigateBackMiniProgram()

uni.navigateBackMiniProgram()是用来关闭当前小程序页面并返回到上一个小程序或者返回到微信/App首页的方法。

// 关闭当前小程序页面并返回到上一个小程序或者返回到微信/App首页
uni.navigateBackMiniProgram({
  extraData: {
    foo: 'bar'
  },
  success: function(){
    console.log('成功关闭当前小程序页面')
  }
})

2. 示例代码说明

下面是一段示例代码，用来演示使用uniapp中的方法关闭当前页面。

< strong >// 在当前页面中触发关闭按钮的点击事件
onCloseTap: function () {
  // 1. 关闭当前页面并返回上一页
  uni.navigateBack({
    delta: 1
  })
  
  // 2. 关闭当前页面并跳转到应用中的某个页面
  uni.redirectTo({
    url: '/pages/index/index'
  })
  
  // 3. 关闭所有页面并跳转到应用中的某个页面
  uni.reLaunch({
    url: '/pages/index/index'
  })
  
  // 4. 关闭当前小程序页面并返回到上一个小程序或者返回到微信/App首页
  uni.navigateBackMiniProgram({
    extraData: {
      foo: 'bar'
    },
    success: function(){
      console.log('成功关闭当前小程序页面')
    }
  })
}

3. 总结

本文介绍了uniapp中常用的几种关闭当前页面的方法，分别是uni.navigateBack()、uni.redirectTo()、uni.reLaunch()、uni.navigateBackMiniProgram()。在使用这些方法时需要注意传参方式、配置页面栈以及页面跳转的顺序等问题。希望本文对您有所帮助。