SOURCE

var Main = {
  data() {
    return {
      tableData: []
    }
  },
  methods: {
    loadContentMethod ({ row }) {
        return new Promise(resolve => {
            setTimeout(() => {
                let childCols = XEUtils.sample([
                { type: 'seq', title: 'Sequence' },
                { field: 'name', title: 'Name' },
                { field: 'role', title: 'Role' },
                { field: 'age', title: 'Age' },
                { field: 'sex', title: 'Sex' }
                ], XEUtils.random(3, 5))
                let childData = XEUtils.sample([
                { name: 'TEST1', role: 'Develop', age: 20, sex: '女' },
                { name: 'TEST2', role: 'Develop', age: 22, sex: '女' },
                { name: 'TEST3', role: 'Develop', age: 24, sex: '男' },
                { name: 'TEST4', role: 'Develop', age: 26, sex: '女' },
                { name: 'TEST5', role: 'Develop', age: 28, sex: '男' },
                { name: 'TEST6', role: 'Develop', age: 30, sex: '男' }
                ], XEUtils.random(1, 5))
                row.childCols = childCols
                row.childData = childData
                resolve()
            }, 500)
        })
    }
  }
};
var Ctor = Vue.extend(Main);
new Ctor().$mount('#app')

<script src="https://cdn.jsdelivr.net/npm/vue"></script>
<script src="https://cdn.jsdelivr.net/npm/xe-utils"></script>
<script src="https://cdn.jsdelivr.net/npm/vxe-table"></script>
<!-- 使用 cdn 引用方式需要注意是否锁定版本，默认指向最新版本 -->

<div id="app">
  <template>
    <div>
        <vxe-table
            border
            resizable
            :tree-config="{children: 'children'}"
            :expand-config="{lazy: true, loadMethod: loadContentMethod}"
            :data="tableData">
            <vxe-table-column field="name" title="Name" tree-node></vxe-table-column>
            <vxe-table-column type="expand" width="80">
                <template v-slot:content="{ row }">
                <vxe-grid :columns="row.childCols" :data="row.childData"></vxe-grid>
                </template>
            </vxe-table-column>
            <vxe-table-column field="size" title="Size"></vxe-table-column>
            <vxe-table-column field="type" title="Type"></vxe-table-column>
            <vxe-table-column field="date" title="Date"></vxe-table-column>
        </vxe-table> 
    </div>
  </template>
</div>

@import url("https://cdn.jsdelivr.net/npm/vxe-table/lib/style.css");