Grid
Container properties
All component configurations support Container properties at the first level.
Component properties
| Name | Type | Default | Supports Variable Pattern | Description |
|---|---|---|---|---|
| className | string | ✔️ | Root div's className | |
| style | object | Root div's style | ||
| colNumber | number | 12 | Number of columns for Grid | |
| gap | number | 8 | The spacing between the rows and columns of Grid is equivalent to the attribute of css flex | |
| rowGap | number | The spacing between Grid lines is equivalent to the attribute of css flex | ||
| columnGap | number | The spacing between Grid columns is equivalent to the attribute of css flex | ||
| justifyItems | string | The properties equivalent to css flex | ||
| justifyContent | string | The properties equivalent to css flex | ||
| alignContent | object | The properties equivalent to css flex |
All the remaining componentsProps will be passed to the component root element (div).
Subcomponent container properties
All son components of the Gird component support an additional span attribute at the container attribute level, which determines the number of columns the son spans in a row.
| Name | Type | Default | Description |
|---|---|---|---|
| span | number | 1 | The number of columns occupied by a child component in the colNumber of the Grid component. For example, when colNumber is equal to 12, the child component setting "span": 4 means occupying one-third of a row. |
JS API
The interface obtained through formApi.getFieldApi() is as follows:
| Name | Type | Description |
|---|---|---|
| node | HTML Element | The root DOM element of the component |