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

    技术2022-07-11  106

    element-ui table中有树形数据表格,在使用的时候想给不同等级的数据添加不同的 icon,改怎么操作呢? 如果只有两种 iocn的话还好说,一般是给个字段用 v-if 判断一下就行了。但是我们需求是文件夹折叠和打开和最子元素,三种用不同的 icon,如图:

    最原始没打开的文件夹 icon

    打开后的文件夹以及最子级的文件: 监听 table的 expand-change时事件: 用v-if判断显示哪一个图标:

    children 是子级,用children判断子级的长度。然后在事件监听中给 row设置一个记录当前是否点开的属性: 就可以实现目标效果了,希望本文对您有所帮助。

    个人微信公众号:侦探小禾子,闲聊育儿生活星座塔罗牌,野生法考通过者免费法律咨询,欢迎关注!

    Processed: 0.009, SQL: 9