如何在Vue Js中遍历Json数组中的子数组?

我有一个JSON数据数组,我需要遍历外部和内部子数组,并需要创建一个表。下面是示例数组

    {
        class:'I',
        subDdiv:[
            {
                div: 'A',
                subjects:['Subject1','Subject2','Subject3']
            },
            {
                div: 'B',
                subjects:['Subject1','Subject2','Subject3']
            },   
        ]
}
    {
        class:'II',
        subDdiv:[
            {
                div: 'A',
                subjects:['Subject1','Subject2','Subject3']
            },
            {
                div: 'B',
                subjects:['Subject1','Subject2','Subject3']
            },   
        ]
}

现在,我需要创建一个表,其中行标题为Class和Div

labels :['class','div']

我写的代码没有给出实际结果,

<el-table :data="array" style="width: 100%">
  <el-table-column v-for="label in labels" :key="label"
   :prop="label"
   :label="label">
   </el-table-column>
 </el-table>

Note: i am using Element Ui Table -https://element.eleme.io/#/en-US/component/table

我需要有这样的桌子

I need to have a table like this

但是我得到的桌子是

enter image description here

请帮助我遍历内部subDiv并创建表。

评论