您好,欢迎访问一九零五行业门户网

Vue中v-for循环节点的实现代码

本篇文章给大家带来的内容是关于vue中v-for循环节点的实现代码,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。
<!doctype html><html lang="en"><head>    <meta charset="utf-8">    <title>title</title></head><body><p id="rrn"><table border="1" cellspacing="0" cellpadding="0">    <tr>        <th>父循环第一次</th>        <th>子循环第一次</th>        <th>json数据的第几条</th>        <th>数值</th>    </tr>    <tbody v-for="dp,index in parentlist" >        <tr v-for="bp,indo in dp.childlist">         <td>{{index}}</td>         <td>{{indo}}</td>         <td>{{bp.index}}</td>         <td>{{bp.childname}}</td>        </tr>    </tbody></table></p></body><script src="vue.js"></script><script>    let er=new vue({        el:#rrn,        data:{            parentlist: [                {                childlist: [{                    index: 1,                    childname: 第一个节点                }, {                    index: 2,                    childname: 第一个节点                }, {                    index: 3,                    childname: 第一个节点                }, {                    index: 4,                    childname: 第一个节点                }, {                    index: 5,                    childname: 第一个节点                }]            },                {                    childlist: [{                        index: 6,                        childname: 第二个节点                    }, {                        index: 7,                        childname: 第二个节点                    }, {                        index: 8,                        childname: 第二个节点                    }, {                        index: 9,                        childname: 第二个节点                    }, {                        index: 10,                        childname: 第二个节点                    }]                },                {                    childlist: [{                        index: 11,                        childname: 第三个节点                    }, {                        index: 12,                        childname: 第三个节点                    }, {                        index: 13,                        childname: 第三个节点                    }, {                        index: 14,                        childname: 第三个节点                    }, {                        index: 15,                        childname: 第三个节点                    }]                }]        }    })</script></html>
相关推荐:
vue项目中文件大小的优化方法介绍
vue中v-if和v-show有何区别?v-if与v-show之间的区别总结
以上就是vue中v-for循环节点的实现代码的详细内容。
其它类似信息

推荐信息