Appearance
- default
- chenghua
- shijingshan
- sybz
- gulou
无数据
包裹组件wrapper
Hidden Title
基础用法：
<sWrapper></sWrapper>属性事件插槽简介
基础用法
更改间距大小 [gap]
一行显示几个 [column]（默认值：null）
设置 column 后，每行按指定列数等分；不设置时为横向滚动布局。基础写法：<sWrapper gap="20px" :column="3"></sWrapper>。
显示在一行, 超出滚动
容器宽高（width / height 默认值：空字符串）
基础写法：<s-wrapper width="360" height="120">内容</s-wrapper>。width、height 类型为 string / number，支持数字、数字字符串、px、rem、百分比等长度，默认值均为 ''，不设置宽高。
API
| 属性名 | 说明 | 类型 | 默认值 |
|---|---|---|---|
width | 容器宽度，数字自动补 px，支持百分比等长度 | string / number | '' |
height | 容器高度，百分比需要父容器具有明确高度 | string / number | '' |
gap | 子项之间的间距，内部会经过 processWidth 处理 | string / number | 16px |
column | 每行展示的列数；不传时保持横向 flex 布局 | number / null | null |
minWidth | 子项最小宽度，内部会经过 processWidth 处理 | string / number | 0 |
插槽
| 插槽名 | 说明 |
|---|---|
default | 需要包裹的 s-item 或任意块级内容 |
说明
- 用于统一包裹多个
item组件，支持设置间距、列数和滚动布局。 - 设置
column后会切换为 grid 等分布局；不设置时使用横向 flex，内容超出后可横向滚动。 gap支持16、'16'、'16px'、'5%'这类常见写法；纯数字或数字字符串会自动补成px。minWidth也支持200、'200'、'200px'、'30%'这类写法。