vue element-ui table expand-change实现不同等级图标设置

vue

element-ui table中有树形数据表格,在使用的时候想给不同等级的数据添加不同的 icon,改怎么操作呢?

如果只有两种 iocn的话还好说,一般是给个字段用 v-if 判断一下就行了。但是我们需求是文件夹折叠和打开和最子元素,三种用不同的 icon,如图:

最原始没打开的文件夹 icon

打开后的文件夹以及最子级的文件:

监听 table的 expand-change时事件:

用v-if判断显示哪一个图标:

children 是子级,用children判断子级的长度。然后在事件监听中给 row设置一个记录当前是否点开的属性:

就可以实现目标效果了,希望本文对您有所帮助。

以上是 vue element-ui table expand-change实现不同等级图标设置 的全部内容, 来源链接: utcz.com/z/376499.html

回到顶部