col 布局规则
配置方式
在 FormCreate 中,可以通过 rule.col 配置项来设置组件的布局规则。Vant 使用 24 栅格系统,默认占满整行。
配置参数
| 参数 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| span | 列元素宽度 | number | string | - |
| offset | 列元素偏移距离 | number | string | - |
| tag | 自定义元素标签 | string | div |
布局示例
基础布局
单列布局(默认)
两列布局
三列布局
偏移布局
使用 offset 设置左侧偏移
使用 Row 和 Col 组件配合布局
除了使用 rule.col 配置项外,还可以使用 row 和 col 组件来手动控制布局。
基础用法
多行布局
提示
- 使用
row和col组件时,需要设置native: true来原样生成组件 - Vant 使用 24 栅格系统,适合移动端布局
- 移动端建议使用单列或两列布局,以获得更好的用户体验


