Skip to content

Grid 宫格组件

宫格组件(Grid)与 24 列栅格布局不同的是,栅格组件(Row、Col)可以自定义一行内的列数,及各列所占比例,宫格组件则是将每行等分为宽度相等的列,甚至可以将单元格设置为正方形,并支持动态适应屏幕,就像九宫格一样。

基础用法

宫格共包含两个组件:GridGridItem

设置 Grid 属性 col 可以指定最大支持的列数

宽高一致

设置属性 border 可以控制是否显示边框,默认为显示(true)。

是否显示边框

设置属性 squaretrue,宫格的高度会与宽度一致,并会自动适应窗口的改变。

Props

属性描述类型可选值默认值
mode布局方式stringflex/gridgrid
cols列数number3
border是否显示边框Booleantrue
square是否宽高一致Booleanfalse