uniapp中subnvues的type设置为popup后关闭会触发页面返回两次是什么原因

在uniapp中使用subNVue时，将type设置为popup后，关闭弹窗会触发页面返回两次，这是什么原因导致的？如何避免这种情况？

2 回复

可能是页面栈管理问题。subNVue关闭时触发了popup的关闭动画，同时可能误触了页面的返回事件。检查代码中是否重复调用了关闭方法，或使用了错误的生命周期钩子。建议检查onBackPress事件和subNVue的关闭逻辑。


在UniApp中，当subNVue的type设置为popup时，关闭时触发两次页面返回的问题通常是由于事件冒泡或重复监听导致的。以下是可能的原因和解决方案：

原因分析

  1. 事件冒泡：popup类型的subNVue关闭时，可能触发了父页面的返回事件。
  2. 重复监听：在代码中可能多次监听了返回按钮事件（如onBackPress），导致关闭时重复触发。
  3. UniApp框架机制：popup类型的subNVue在关闭时可能默认触发一次返回，而开发者手动添加的监听又触发了一次。

解决方案

  1. 检查事件监听：确保没有重复监听返回事件。例如，在onBackPress中避免重复处理subNVue的关闭逻辑。
  2. 使用hide方法关闭：通过调用subNVue.hide()而非依赖返回按钮关闭，避免触发页面返回事件。
  3. 阻止事件冒泡：在关闭subNVue时，使用event.stopPropagation()（如果适用）或检查事件传递逻辑。

示例代码

// 在页面中定义subNVue
const subNVue = uni.getSubNVueById('popupSubNVue');

// 关闭subNVue时使用hide方法，避免触发返回事件
function closePopup() {
  subNVue.hide(); // 直接隐藏，不触发返回
}

// 监听返回按钮事件，避免重复处理
onBackPress(options) {
  if (subNVue && subNVue.isShow) {
    subNVue.hide(); // 隐藏subNVue
    return true; // 阻止默认返回行为
  }
  return false; // 其他情况允许返回
}

注意事项

  • 确保在pages.json中正确配置subNVue的type为popup。
  • 测试时检查是否有多个地方监听了返回事件，并移除冗余代码。

通过以上调整，通常可以解决关闭popup类型subNVue时触发两次返回的问题。如果问题持续，请检查UniApp版本更新或提交问题到官方社区。

回到顶部