vue-table-with-tree-grid的用法

1.在可视化面板安装依赖

点击查看详情 可以查看官方的具体的官方仓储，可以参照excample的实例来使用。

2.在vscode里面导入

 

 Vue.component注册为全局可用的组件。

3.根据文档来写就行。例子：

<tree-table
        class="treeTable"
        :data="goodsList"
        :columns="columns"
        :selection-type="false"
        :expand-type="false"
        show-index
        index-text="#"
        border
      >
       
      </tree-table>

 

在

cloumns里面定义标题行等信息。 template: '***'定义插槽名称

columns: [
        {
          label: '分类名称',
          prop: 'cat_name'
        },
        {
          label: '是否有效',
            //表示定义为模板列
          type: 'template',
            //定义模板列名称
          template: 'isok'
        },
        {
          label: '排序',
          type: 'template',
          template: 'scot'
        },
        {
          label: '操作',
          type: 'template',
          template: 'opt'
        }
      ],