# 移动端组件

移动端最典型的两种浮现方式：整块选择面板与操作确认，都从底部升起。

## 组合演示

:::preview 组合用法 || 点击「缓存有效期」行打开 Picker，点按钮打开底部弹层

demo-preview=../demos/scenarios/mobile.vue

:::

## 这个场景覆盖了什么

- **列表触发的选择面板**：`t-cell` 当前值 + 箭头，点击后用 `t-popup` 从底部升起 `DurationPicker`
- **操作确认**：`BottomPopup` 承载标题与左右按钮，按钮只抛事件、关闭由业务决定
- **间距**：`Space` 统一控制一组元素之间的间距

## 关于 destroy-on-close

示例里的 Picker 弹层加了 `destroy-on-close`，每次打开都重建，避免上次的选择残留。选择面板这类有内部滚动状态的组件建议都带上。

## 相关组件

- [DurationPicker](/components/duration-picker)
- [BottomPopup](/components/bottom-popup)
- [Space](/components/space)