vue父组件传递博文数组给子组件

Question

情况是这样的。

子组件是个table,

<template>
  <div>
    <template>
      <el-table
        :data="list.data"
        style="width: 100%">

         <el-table-column :label="labels[index-1].label" v-for="(items, index) in list.data" :key="items.key">
          <template >{{ items[labels[index-1].para] }}</template>
        </el-table-column>

      </el-table>
    </template>
  </div>
</template>
<script>
export default {
  data () {
    return {
    }
  },
  props: {
    labels: Array,
    list: Object,
  },
  mounted () {
    console.log(this.labels)
    console.log(this.list)
  }
}
</script>

父组件传个数组给子组件，例如以下这种数据:

 list: { //  用户信息
       data: [], //  数据
       total: 0 //  总数
 },
 labels: [
       {
         label: '公司名字',
         para: 'companyName',
       },
       {
         label: '联系电话',
         para: 'tel'
       },
       {
         label: '联系人',
         para: 'name',
       },
       {
         label: '公司地址',
         para: 'address',
       },
       {
         label: '邮箱',
         para: 'email'
       },
     ],

<table-items :list="list" :labels="labels"></table-items>

官网是在父组件循环时传递参数

可以直接在子组件就循环吗？

现在报错是 子组件解析出来是[object，object]， 有什么好的解决方法吗？

Answer 1

<el-table-column 
    v-for="(item, index) in labels" :key="item.para"
    :label="item.label" :prop="item.para"
></el-table-column>

Answer 2

可以直接传递数组和对象的，console.log打印出来是什么？