uni-popup如何遮挡住uniapp自带的tabbar

要想在uni-app中使用uni-popup遮挡住uni-app自带的tabbar，可以通过设置popup组件的z-index属性来实现。具体步骤如下：

1. 在页面中引入popup组件，并设置其z-index属性为较大值，例如999。

2. 在页面中使用tabbar组件，并设置其z-index属性为较小值，例如1。

3. 在popup组件弹出时，通过设置tabbar组件的display属性为none来隐藏它，避免被popup组件遮挡。

4. 在popup组件关闭时，通过设置tabbar组件的display属性为block来显示它，保证其正常显示。

示例代码如下：

<template>
  <view>
    <!-- 引入popup组件 -->
    <uni-popup v-model="showPopup" z-index="999">
      <!-- popup内容 -->
    </uni-popup>
    <!-- 使用tabbar组件 -->
    <uni-tab-bar z-index="1">
      <!-- tabbar内容 -->
    </uni-tab-bar>
  </view>
</template>

<script>
  export default {
    data() {
      return {
        showPopup: false
      }
    },
    methods: {
      openPopup() {
        // 弹出popup时，隐藏tabbar
        uni.hideTabBar({
          animation: true
        });
        this.showPopup = true;
      },
      closePopup() {
        // 关闭popup时，显示tabbar
        uni.showTabBar({
          animation: true
        });
        this.showPopup = false;
      }
    }
  }
</script>