Vue递归组件实现层层嵌套显示数据

Posted 浚琦的代码世界

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Vue递归组件实现层层嵌套显示数据相关的知识,希望对你有一定的参考价值。

问题来自朋友...记录一下

需求是表格头部后端返回的数据中是不确定的 n维数据,表头存在于 listVo 字段中,如何实现层层显示呢?

温馨提示,以下内容为5张大图,请打开 WIFI 享用...

以下为效果图:

 

 以下为数据结构:

 

 

解决方法一:最笨的方法,有几层就循环几层,你们愿意用就用啊,我要讲新方法 ^-^

 

 优秀的解决方法二:定义一个组件,递归它 = =.

 

 使用位置:

 

 是不是很奇特,喜欢就留言吧 ^-^

 

以上是关于Vue递归组件实现层层嵌套显示数据的主要内容,如果未能解决你的问题,请参考以下文章

vue.js - 使用原始 json 中的嵌套数组时,递归组件不会更新

vue组件递归——级联菜单的实现

vue 之组件递归;

vue多层嵌套组件传值

Vue递归组件:渲染嵌套评论

JS使用Vue自定义组件实现动态多层数据渲染+递归+踩坑