ant-design-vue中table套table数据显示不出

模板如下：
<a-table

  :columns="columns"

  :dataSource="data"

  @expand="getDetail"

  :loading="loading"

  @change="changeTable"

  :rowKey="record => record.id"

  :pagination="{total:count,pageSize:pageSize}"

  :locale="{emptyText: '暂无数据'}"

>

  <a-table

    slot="expandedRowRender"

    slot-scope="record"

    :columns="innerColumns"

    :dataSource="record.innerData"

    :rowKey="record => record.id"

    :pagination="false"

    :locale="{emptyText: '暂无数据'}"

  >

  </a-table>

</a-table>

js如下：
getDetail(expanded, record) {

  const param = {

    id: record.id

  };

  if (!expanded) return;

  this.api

    .repayLogDetail(param)

    .then(res => {

      if (res.code === "SUCCESS") {

        const { repayLogDetailItems = [] } = res.data;

        record.innerData = repayLogDetailItems;

      }

    })

    .catch(err => {});

},

展开的时候，给每一个子项都添加了innerData属性，但是子table的数据 依然展示不出来。

原因猜想：

可能是因为父table的数据里面，没有innerData这个属性，所以不管子table如何修改这个innerData属性，都对父table里面的数据产生不了影响，而且子table的数据渲染，需要从父table里面传下来

解决方式：

在父table里面添加对应元素的innerData属性，完美解决

getRecordList(param) {

  this.loading = true;

  this.api

    .repayLog(param)

    .then(res => {

      this.loading = false;

      if (res.code === "SUCCESS") {

        const { repayLogItems = [], count } = res.data;

        repayLogItems.forEach(item => {

          item.innerData = [];

        });

        this.data = repayLogItems;

        this.count = count;

      }

    })

    .catch(err => {});

},