# Backdrop 遮罩层

[toc]

`Backdrop` 组件提供遮罩层，用于强调特定的页面元素，并阻止用户进行其他操作。

## 组件引入

在`app.json`或在`index.json`中引入：

```json

{
  "usingComponents": {
    "tea-backdrop": "../dist/backdrop/index"
  }
}

```

## 用法

```html
<tea-backdrop></tea-backdrop>
```

## Props

| 参数      | 描述          | 类型              | 默认值     |
| ------- | ----------- | --------------- | ------- |
| show    | 是否展示遮罩层     | `Boolean`       | `false` |
| offsetY | 弹出层在Y轴上的偏移量 | `String,Number` | `0`     |

## Slots

| 名称  | 描述           |
| --- | ------------ |
| -   | 用于在遮罩层上方嵌入内容 |

## 外部样式类

| 类名          | 描述       |
| ----------- | -------- |
| `ext-class` | 组件根节点样式类 |

## CSS变量属性表

| 变量名                       | 默认值                | 描述  |
| ------------------------- | ------------------ | --- |
| backdrop-background-color | rgba(0, 0, 0, 0.6) | -   |
| backdrop-zindex           | @zindex-backdrop   | -   |