38 lines
1005 B
Markdown
38 lines
1005 B
Markdown
# BottomPopup 底部弹层
|
|
|
|
从底部升起的操作面板，可带标题与左右按钮。
|
|
|
|
## 基础用法
|
|
|
|
:::preview 基础用法 || 弹层从视口底部升起，标题栏在内容滚动时吸顶
|
|
|
|
demo-preview=../demos/bottom-popup/basic.vue
|
|
|
|
:::
|
|
|
|
## 何时使用
|
|
|
|
需要在移动端承载一组操作或一段表单时使用。它基于 TDesign Mobile 的 `Popup`，因此遮罩、层级与动画都沿用框架行为。
|
|
|
|
## 按钮只抛事件
|
|
|
|
左右按钮**不会自动关闭弹层**，只抛出 `leftButtonClick` / `rightButtonClick`，关闭与否由业务决定：
|
|
|
|
```vue
|
|
<bottom-popup
|
|
v-model="visible"
|
|
title="选择操作"
|
|
@right-button-click="handleConfirm"
|
|
/>
|
|
```
|
|
|
|
按钮文案传空字符串即可隐藏对应按钮；也可以分别用 `leftButton` / `rightButton` 插槽完全接管，插槽会收到 `onClick`。
|
|
|
|
## 高度
|
|
|
|
`height` 默认 `"auto"`，按内容撑开；传具体值（如 `"60vh"`）时内容区滚动、标题栏吸顶。
|
|
|
|
## API
|
|
|
|
<api-table name="BottomPopup" />
|