Ant Design Vue grid的row属性
时间: 2024-05-09 08:21:04 浏览: 7
Ant Design Vue 的 Grid 组件中的 row 属性是用于指定 Grid 中的行数。它的值可以是一个数字,表示 Grid 中的行数,也可以是一个由数字和断点组成的数组,表示在不同的断点上 Grid 中的行数不同。
例如:
```html
<template>
<a-row :gutter="16" :row="4">
<a-col :span="12">col-12</a-col>
<a-col :span="12">col-12</a-col>
<a-col :span="8">col-8</a-col>
<a-col :span="8">col-8</a-col>
<a-col :span="8">col-8</a-col>
<a-col :span="6">col-6</a-col>
<a-col :span="6">col-6</a-col>
<a-col :span="6">col-6</a-col>
<a-col :span="6">col-6</a-col>
</a-row>
</template>
```
在这个例子中,row 属性的值为 4,表示 Grid 中有 4 行。在 Grid 中,每个 a-row 表示一行,每个 a-col 表示一列。由于 Grid 中只有 4 行,因此 a-col 中的 col-6 会被自动放置在第 4 行中。如果 row 属性的值为 3,则 a-col 中的 col-6 会被放置在第 3 行中。