uni-app安卓监听物理返回键关闭弹出层

开发 APP 安卓端在页面上出现弹出层的时候，按返回键执行关闭弹出层是一种更为合理的交互逻辑。
直接上代码了。

<template>
  <view>
    <button @click="open" type="primary" size="mini">打开弹出层</button>
    <uni-popup ref="pop" type="bottom">
      <view class="pop-content"></view>
    </uni-popup>
  </view>
</template>

<script>
  export default {
    data() {
      return {
        popFlag: false, // 用来判断弹出层是否显示
      }
    },
    onBackPress(e) { // 监听页面返回操作的生命周期函数
      // 判断是否是返回键触发的返回 和 弹出层是否弹出
      if (e.from === "backbutton" && this.popFlag) { 
        this.close(); // 关闭弹出层
        return true; // 阻止默认返回行为
      }
      return false; // 无自定义操作 默认为 false
    },
    methods: {
      open() {
        this.$refs.pop.open();
        this.popFlag = true;
      },
      close() {
        this.$refs.pop.close();
        this.popFlag = false;
      }
    }
  }
</script>

<style scoped>
  .pop-content {
    width: 100%;
    height: 600rpx;
    background-color: #fff;
    border-radius: 20rpx 20rpx 0 0;
  }
</style>