嵌套數組和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>