嵌套数组和v-的

Question

嗯，这个问题我难倒了......具有麻烦一点得到嵌套的for循环的数据显示：

<div v-if = "private.folders!=null" v-for="folder in private.folders"> 
{{folder.name}} 
    <div v-for="check in folder.checks"> 
     {{check.name}} 
    </div> 
</div> 

，然后将数据我” m试图使用看起来像这样：

folders [Array] 
-object [this is a single 'folder'] 
--name 
--checks [array] [each folder has this array] 
---[object] [the actual 'check' object] 
----[name] 

外环工作正常，并返回我期望的数据。但是，check.name不会返回任何内容，并且控制台中没有错误。是否有可能这样做嵌套for循环？

Answer 1

我测试了你的模板，它的工作原理。

new Vue({ 
 
    el: '#sample', 
 
    data: { 
 
    private: { 
 
     folders : [{ 
 
      name : 'folder1', 
 
      checks : [ 
 
      { name : 'check1.1' }, 
 
      { name : 'check1.2' } 
 
      ] 
 
     }, 
 
     { 
 
      name : 'folder2', 
 
      checks : [ 
 
      { name : 'check2.1' }, 
 
      { name : 'check2.2' } 
 
      ] 
 
     } 
 
     ] 
 
    } 
 
    } 
 
})

<script src="https://cdn.jsdelivr.net/vue/latest/vue.js"></script> 
 
<div id="sample"> 
 
    <div v-if = "private.folders!=null" v-for="folder in private.folders"> 
 
    {{folder.name}} 
 
     <div v-for="check in folder.checks"> 
 
      {{check.name}} 
 
     </div> 
 
    </div> 
 
</div>