前言
栅格是多设备场景下通用的辅助定位工具,通过将空间分割为有规律的栅格。
GridRow为栅格容器组件,需与栅格子组件GridCol在栅格布局场景中联合使用。
栅格布局主要优势包括:
1.提供可循的规律:栅格布局可以为布局提供规律性的结构,解决多尺寸多设备的动态布局问题。通过将页面划分为等宽的列数和行数,可以方便地对页面元素进行定位和排版。
2.统一的定位标注:栅格布局可以为系统提供一种统一的定位标注,保证不同设备上各个模块的布局一致性。这可以减少设计和开发的复杂度,提高工作效率。
3.的间距调整方法:栅格布局可以提供一种灵活的间距调整方法,满足特殊场景布局调整的需求。通过调整列与列之间和行与行之间的间距,可以控制整个页面的排版效果。
4.自动换行和自适应:栅格布局可以完成一对多布局的自动换行和自适应。当页面元素的数量超出了一行或一列的容量时,他们会自动换到下一行或下一列,并且在不同的设备上自适应排版,使得页面
布局更加灵活和适应性强。
GridRow
GridRow(option?: GridRowOptions)
GridRowOptions对象
1.columns:布局列数
2.gutter:布局间隙
●GutterOption
x:栅格子组件水平方向间距
y:栅格子组件垂直方向间距
3.breakpoints:断点设置
●value:设置断点位置的单调递增数组
●reference:断点切换参照物