SOURCE

var Main = {
  data (vm) {
        return {
            tableData: [],
            gridOptions: {
                border: true,
                columns: [
                    {type: 'seq', width: 60},
                    {field: 'name',title: 'Name'},
                    {field: 'sex',title: 'Sex'},
                    {field: 'date',title: 'Date'},
                    {field: 'address',title: 'Address'}
                ],
                data: []
            },
            rowConfig: {
                height: 37,
            },
            treeConfig: {
                lazy: true,
                transform: true,
                loadMethod: vm.loadMethod,
                hasChild: "hasLeaf",
                rowField: 'id',
            },
        }
    },
    methods: {
        loadMethod() {
            return new Promise((resolve, reject) => {
                let date = +new Date();
                console.log(date)
                resolve([{
                    name: "test" + date,
                    role: "developer",
                    sex: "Man",
                    date: "2019-05-01",
                    time: 1556677810888 + date * 500,
                    region: "ShenZhen",
                    address: "address abc" + date,
                    id: date,
                    hasLeaf: true,
                }]);
            });
       },
       loadData() {
           console.log(this.tableData)
           this.$refs.vxc.loadData(this.tableData)
       },
    },
    mounted () {
        var list1 = []
        for(var index = 0; index < 99; index++){
            list1.push({
                name: 'test' + index,
                role: 'developer',
                sex: 'Man',
                date: '2019-05-01',
                time: 1556677810888 + index * 500,
                region: 'ShenZhen',
                address: 'address abc' + index,
                id: index,
                hasLeaf: true,
            })
        }
        this.tableData = list1
        this.loadData()
    }
};
var app = new Vue(Main).$mount('#app')

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

<div id="app">
  <template>
    <div>
      <p>Table 演示</p>
      <vxe-table
        :row-config="rowConfig"
        :tree-config="treeConfig"
        :data="tableData"
        ref="vxc"
        height="500"
        >
        <vxe-column field="name" title="Name" :tree-node="true"></vxe-column>
        <vxe-column field="sex" title="Sex"></vxe-column>
        <vxe-column field="date" title="Date"></vxe-column>
        <vxe-column field="address" title="Address"></vxe-column>
        </vxe-table>
    </div>
  </template>
</div>

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