uniapp中弹出层如何遮挡住uniapp中自带的tabbar

在uniapp中，如果你想要在弹出层（比如toast、dialog或者自定义的popup等）时遮挡住自带的tabbar，你可以通过控制tabbar的显示与隐藏来实现。

以下是一个简单的示例，展示如何在弹出层出现时隐藏tabbar，在弹出层消失时显示tabbar：

<template>
  <view>
    <!-- 你的内容 -->
    <button @click="showToast">显示弹出层</button>
    <uni-toast ref="toast" text="这是一个toast" duration="2000"></uni-toast>
  </view>
</template>
 
<script>
  export default {
    methods: {
      showToast() {
        // 弹出toast之前隐藏tabbar
        uni.hideTabBar({
          animation: true,
          success: () => {
            this.$refs.toast.show();
          },
          fail: () => {
            console.error('隐藏tabbar失败');
          }
        });
      },
      hideToast() {
        // 弹出toast消失时显示tabbar
        this.$refs.toast.hide();
        uni.showTabBar({
          animation: true,
          success: () => {
            // 操作成功
          },
          fail: () => {
            console.error('显示tabbar失败');
          }
        });
      }
    }
  }
</script>

在这个示例中，我们使用了<uni-toast>组件，并通过ref属性引用它。在showToast方法中，我们首先调用uni.hideTabBar()来隐藏tabbar，在成功的回调中显示toast。在toast显示期间，我们可以监听其消失事件，在事件处理函数中调用uni.showTabBar()来显示tabbar。

请注意，这只是一个简单的示例，你可能需要根据实际的组件和逻辑来调整代码。