我想使用h5, 禁止原生返回，并且弹出弹窗问他返回将不能交易， 他点击确认在给他返回，我使用的是 window.history.pushState(null, null, document.URL); window.addEventListener('popstate', this.webGoBack)，但是现在的问题是两个相同的路由返回他会重新执行生命周期（以前并不会）。如果大家有啥别的好方法也可以告诉我

[youngpj]

相关平台

微信小程序

复现仓库

https://github.com/youngpj/taroTest.git
小程序基础库: 无
使用框架: React

复现步骤

点击返回 相同路由 他的生命周期执行了

期望结果

两个相同的路由返回他不会执行生命周期

实际结果

两个相同的路由返回他会执行生命周期

环境信息

Taro v3.6.6


  Taro CLI 3.6.6 environment info:
    System:
      OS: macOS 12.1
      Shell: 5.8 - /bin/zsh
    Binaries:
      Node: 16.13.2 - /usr/local/bin/node
      npm: 8.1.2 - /usr/local/bin/npm
    npmGlobalPackages:
      typescript: 3.9.7

[youngpj]

写错了 是h5

[yoyo837]

原生返回是不支持禁止的吧

[youngpj]

是啊。本来是不支持的，所以用了window.history.pushState(null, null,document.URL); window.addEventListener('popstate', this.webGoBack) 这两个非常规操作，模拟了禁止返回实际上还是返回的，让你表面看起来没有返回

[ZakaryCode]

执行是正常的，这类非常规操作可以自行适配（记录个变量在执行生命周期时判断下就行

[youngpj]

原来不是不执行吗，vue-router 和react-router 都不执行， 关键是你咋记录呢，
或者你有啥别的可以在返回之前弹窗确认的方法吗？

[ZakaryCode]

原来不是不执行吗

对，但那是个需要被修复的错误

关键是你咋记录呢

context、globaldata、storage、window 都可以，按需选择

在返回之前弹窗确认的方法

这是浏览器操作，无法再触发前阻塞

[youngpj]

大神，那你感觉我用window.history.pushState(null, null,文档.URL); window.addEventListener('popstate', this.webGoBack) 这个玩意行不行，我觉得有点坑啊，但实际上没有啥好的办法。。。
context、globaldata、storage、window都可以，按需选择，
这个玩意放在这里我觉得好难维护啊（因为很多页面要这个弹窗，跳转，返回，刷新 返回一次点取消太多场景了）

[ZakaryCode]

用window.history.pushState(null, null,文档.URL); window.addEventListener('popstate', this.webGoBack) 这个玩意行不行

不行，仅这些无法控制生命周期触发

这个玩意放在这里我觉得好难维护啊（因为很多页面要这个弹窗，跳转，返回，刷新 返回一次点取消太多场景了）

写个高阶组件或者钩子包一下咯，又不是每个地方使用都需要重写