【VUE】ant-design-vue table 初级应用:column中通过DataIndex与data中的项关联;让列值变成超链接;添加action列

磕磕绊绊才(大概)搞懂官网的例子。简单记录一下

例子:

https://www.antdv.com/components/table-cn/#components-table-demo-ellipsis-column

 

【VUE】ant-design-vue table 初级应用:column中通过DataIndex与data中的项关联;让列值变成超链接;添加action列_第1张图片


(code同样来自官网例子)

1 如何确定每一列都显示的是data中的哪一项:

column中的dataIndex

【VUE】ant-design-vue table 初级应用:column中通过DataIndex与data中的项关联;让列值变成超链接;添加action列_第2张图片

和data中每一个元素中的key:

【VUE】ant-design-vue table 初级应用:column中通过DataIndex与data中的项关联;让列值变成超链接;添加action列_第3张图片

 

2 如何让某一列成为超链接:

首先,template中加入:

    {{ text }}

然后,在想要变成超链接的列加入:

scopedSlots: { customRender: 'name' },

slot可以不一定是name,但一定要与customRendermatch。

比如:



                    
                    

你可能感兴趣的:(vue,JS,vue.js)