28 lines
954 B
Markdown
28 lines
954 B
Markdown
# 移动端组件
|
||
|
||
移动端最典型的两种浮现方式：整块选择面板与操作确认，都从底部升起。
|
||
|
||
## 组合演示
|
||
|
||
:::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)
|