Vue3 table表格组件的使用

目录

• 一、Ant Design Vue
• 1、官网地址
• 2、怎么使用
• 3、将电子书表格进行展示
• 二、总结

一、Ant Design Vue

在大量数据需要展示时，我们一般都会以报表的形式展现，按照直觉习惯，肯定使用table表格来展示行列数据。

因此，我们要使用Ant Design Vue组件库中的table组件，来进行数据的绑定。

1、官网地址

官网地址：https://2x.antdv.com/components/table-cn#API

2、怎么使用

我们先对电子书管理页面改造，将布局进行调整，

示例代码如下：

效果如下：

3、将电子书表格进行展示

要做的事：

• 表格渲染
• slots: 自定义渲染
• title: 表头渲染
• customRender: 值渲染

示例代码如下：

实际效果：

二、总结

对于table组件的使用不是很熟的话，需要不断去尝试，简单说，就是对象属性的映射。

总体感觉下来，还是进行数据绑定后，在进行页面展示，如不是很清晰，请参考这篇《Vue3 列表界面数据展示详情》文章。

到此这篇关于Vue3 table表格组件的使用的文章就介绍到这了,更多相关Vue3 table表格组件内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！