小程序监听返回、阻止页面返回、弹框后禁止返回

这篇具有很好参考价值的文章主要介绍了小程序监听返回、阻止页面返回、弹框后禁止返回。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

需求：

在页面内弹出半屏的弹窗或在页面内加载一个全屏的子页面时，用户进行返回操作会直接离开当前页面，不符合用户预期，预期应为关闭当前弹出的组件。
为此官方提供“page-container”容器组件，效果类似于 popup弹出层，页面内存在该容器时，当用户进行返回操作，关闭该容器不关闭页面。返回操作包括三种情形，右滑手势、安卓物理返回键和调用 navigateBack 接口。

具体使用：

  <page-container show="{{isShowTextarea}}" z-index="999999999" bind:beforeenter="beforeenter">
  <!-- 这里为自定义的弹框内容 -->
    <view class="show_textarea">
      <form bindsubmit="hideTextarea">
        <textarea style="height:calc(100vh - 200rpx);" confirm-type="done" auto-focus="true" class="textarea_box2" placeholder="输入文字（300字以内）" maxlength="300" name="textarea" id="subtitleWidth" value="{{subtitle}}"></textarea>
        <button form-type="submit" class="textarea_submit_ai" style="width: 200rpx;height: 70rpx;line-height: 70rpx;">确认</button>
      </form>
    </view>
  </page-container>

简单来说，就是把自己写的弹框，最外面标签换成page-container，用户点击导航栏的返回键、左滑操作返回等，会关闭这个弹框，而不会关闭整个页面。

详细的api有：
小程序监听返回、阻止页面返回、弹框后禁止返回
参考官方文档：https://developers.weixin.qq.com/miniprogram/dev/component/page-container.html文章来源地址https://www.toymoban.com/news/detail-509588.html