(1) html部分

<a-table
    :columns="columnsTask"
    :data-source="taskData"
    ref="tableTask"
    row-key="id"
    @expand="expand"
    :expandIconColumnIndex="2"
    >
</table>
<!--    
expand：点击展开图标触发的回调函数
expandIconColumnIndex：展开的图标在table的列数
                -->

(2) 函数部分

expand (flag,e) {
// flag: 传true时展开，传false时收缩，这里可以根据此参数控制调用获取子数据
          if (flag) {
            this.getSubList(e)
          }
        },

（3）** 父级数据中存在children字段时才会显示展开图标

taskData: [
{
    ...,
    children: []
},
...
]

效果图

以上介绍了ant design vue的树状表格的最基础用法，下一节将介绍树状表格的第二种用法，包括，改变图标。