布局
布局组件用来协助进行页面级整体布局。
每个布局组件都是一个N行M列的盒子,行列数可以自由修改,复杂的布局可以用多个布局组件组合来实现。比如下图中的顶部-侧边布局,顶部可以是一个1行1列的布局组件,下面是一个1行2列的布局组件。

何时使用
- 进行页面整体布局时使用
- 需要局部创建N行M列布局时使用,行和列都可以自由增删
- 每一个网格都是一个插槽
功能演示
上中下布局
这种布局可以用3个1行1列的布局组件,也可以用1个3行1列的布局组件来实现。
行列数可以在布局组件的右侧配置栏中进行修改:选中布局组件,添加行或列;选中行列,可以进行删除

固定侧边栏布局

完整配置
布局
常规
| 属性名称 | 说明 |
|---|---|
| 添加行 | 可以无限制地向布局组件添加行 |
| 添加列 | 可以无限制地向布局组件添加列 |
交互
| 属性名称 | 说明 |
|---|---|
| 运行时调整列宽 | 可以开启或关闭 |
样式
详见《基础必读》-组件配置
布局-列
常规
| 属性名称 | 说明 |
|---|---|
| 宽度填充 | 宽度填充可以选择自动、百分比、固定、适应内容 |
| 内容布局 | 详见《基础必读》-内容布局 |
| 操作 | 前面添加列、后面添加列、后移、删除 |
交互
可以设置列的点击事件
样式
详见《基础必读》-组件配置
布局-行
常规
| 属性名称 | 说明 |
|---|---|
| 列间距 | 布局是由行组成的,行是由列组成的,多个列直接的间隔可以调整 |
| 列自定义 | 行的默认行为是:所有的行有着一样的列数。如果一个行开启了这一项,则它的列数就可以和其他行不一样,这为复杂布局提供了便利 |
| 操作 | 前面添加行、后面添加行、下移、列等分、删除 |
交互
可以设置行的点击事件
样式
| 属性名称 | 说明 |
|---|---|
| 高度填充 | 宽度填充可以选择自动、百分比、固定 |