Skip to main content

<DataTable>

<DataTable title="简单表格" :rows="[['表头1','表头2','表头3'], ['内容1','内容2','内容3']]" />

数据表格组件。用于根据数据渲染表格

API#

名称类型描述默认值
titlestring标题
rowsstring[][]表格内容[]
size"small" | "middle" | "large"表格大小类型"middle"
heightnumber表格内容高度,如果填了的话则会限制高度
note

如果 rows 传入的数据不是一个数组的话。会视为空数组

示例#

紧凑表格#

<DataTable title="紧凑表格" size="small" :rows="[['表头1','表头2','表头3'], ['内容1','内容2','内容3']]" />

大量数据表格#

<Var name="tableExample" value="_range(100).map((x) => _range(3).map(y => `内容${x}-${y}`))" />
<DataTable title="大量数据" height="200" :rows="[['表头1','表头2','表头3'], ...tableExample]" />