uni-app h5中使用uni.reLaunch(OBJECT)未关闭所有页面栈（a->b->c->d -reLaunch->a）仍然可以点击浏览器回退到c、b、a

uni-app h5中使用uni.reLaunch(OBJECT)未关闭所有页面栈（a->b->c->d -reLaunch->a）仍然可以点击浏览器回退到c、b、a

开发环境 版本号 项目创建方式
Windows win10 HBuilderX

示例代码：

<template>
<view class="container">
<view class="title">测试页面D</view>
<button type="primary" @click="backToA">返回页面A（使用reLaunch）</button>
</view>
</template>  
<script>
export default {
data() {
return {}
},
methods: {
backToA() {
uni.reLaunch({
url: '/pages/test-a/test-a'
})
}
}
}
</script>  
<style>
.container {
padding: 20px;
display: flex;
flex-direction: column;
align-items: center;
}
.title {
font-size: 20px;
margin-bottom: 20px;
}
</style>

更多关于uni-app h5中使用uni.reLaunch(OBJECT)未关闭所有页面栈（a->b->c->d -reLaunch->a）仍然可以点击浏览器回退到c、b、a的实战教程也可以访问 https://www.itying.com/category-93-b0.html

3 回复

hx升级到最新版本试试

更多关于uni-app h5中使用uni.reLaunch(OBJECT)未关闭所有页面栈（a->b->c->d -reLaunch->a）仍然可以点击浏览器回退到c、b、a的实战教程也可以访问 https://www.itying.com/category-93-b0.html


升级到4.76仍然没用，这是浏览器的历史记录。不是点击项目中头部的返回箭头，是点击浏览器的返回

这是一个已知的uni-app在H5端的实现差异问题。uni.reLaunch在H5环境下确实无法像原生应用那样完全清空页面栈，因为浏览器的历史记录机制无法被完全覆盖。

问题原因： H5平台基于浏览器环境，uni.reLaunch实际上是通过window.location.replace实现页面跳转，但浏览器的历史记录堆栈仍然保留了之前的页面访问记录。

解决方案：

  1. 使用uni.navigateBack组合：
// 先获取当前页面栈深度
const pages = getCurrentPages()
uni.navigateBack({
  delta: pages.length - 1,
  success: () => {
    uni.navigateTo({
      url: '/pages/test-a/test-a'
    })
  }
})
  1. H5专用处理：
backToA() {
  // #ifdef H5
  window.history.replaceState(null, '', '/')
  setTimeout(() => {
    uni.navigateTo({
      url: '/pages/test-a/test-a'
    })
  }, 100)
  // #endif
  
  // #ifndef H5
  uni.reLaunch({
    url: '/pages/test-a/test-a'
  })
  // #endif
}
回到顶部