对象和 v-for 的嵌套数组 [英] Nested arrays of objects and v-for
本文介绍了对象和 v-for 的嵌套数组的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
好吧,这个问题让我难住了...在显示嵌套的 for 循环数据时遇到了一些麻烦:
{{文件夹名称}}<div v-for="check in folder.checks">{{check.name}}
然后我尝试使用的数据如下所示:
文件夹 [数组]-object [这是一个文件夹"]- 姓名--checks [array] [每个文件夹都有这个数组]---[对象] [实际的检查"对象]- - [姓名]
外循环工作正常,并返回我期望的数据.但是, check.name 不返回任何内容,并且控制台中没有错误.是否可以像这样进行嵌套的 for 循环?
解决方案
我测试了你的模板,它有效.
new Vue({el: '#sample',数据: {私人的: {文件夹:[{名称:'文件夹1',检查: [{名称:'check1.1'},{名称:'check1.2'}]},{名称:'文件夹2',检查: [{名称:'check2.1'},{名称:'check2.2'}]}]}}})
<script src="https://cdn.jsdelivr.net/vue/latest/vue.js"></脚本><div id="样本"><div v-if = "private.folders!=null" v-for="private.folders 中的文件夹">{{文件夹名称}}<div v-for="check in folder.checks">{{check.name}}