Vue公司和子元件构件

Question

我有一个复杂的对象，为了简洁的目的被构造以这种方式：

{ 
    Sample: [{ 
     Model: { 
      Id: "1" 
     }, 

     Collection: [{ 
      Id: "1" 
     }]  
    }] 
} 

数据表使得该模型数据细。但是，当试图访问集合时，表格不会输出数据。

<template> 
    <el-table :data="Sample" highlight-current-row :row-class-name="tableRow" stripe :default-sort="{ prop: 'Sample.Id, order: 'descending'}"> 
      <el-table-column type="expand"> 
       <el-row :gutter="20" v-for="property in Collection"> 
        <el-col :span="24"><div>Id: {{ property.Id }}</div></el-col> 
       </el-row> 
      </el-table-column> 
      <el-table-column prop="Model.Id" label="Id" width="300"></el-table-column> 
    </el-table> 
</template> 

绑定到表的数据是否忽略循环？我能够在绑定期间作为道具访问数据，但是当添加循环时，数据不会输出。

Element-io Vue

Answer 1

我知道为什么循环不行的，因为Collection在Sample。你的数据结构是一个Sample数组，它包含一个对象。

所以，你可以修改代码这样：

v-for="(property,index) in Sample[0].Collection"