Vue-lazy-table-tree NPM

vue-lazy-table-tree

Getting Started

Installation

npm

# install with npm    
npm install vue-lazy-table-tree --save

Import the library

    import TableTree from 'vue-lazy-table-tree';

Add to other Vue components

   export default {
       components: {
           TableTree             
       },
   // ... data, methods, mounted (), etc.
   }

script

# 直接通过标签引用 具体可以参考demo/tree.html    
<script src="./vue-lazy-table-tree.umd.min.js"></script>

tree.html.

<table-tree :data-list="dataList"   :name="'displayName'" :expanded="'isExpanded'"
    :left='10' :page="15"
        title="值" class="table">
    <div slot="类型"  slot-scope="{item}">{{item.displayType}}</div>
    <div slot="值" slot-scope="{item}">{{item.value}}</div>
    <div slot="操作" slot-scope="{item,keys}">
        <span @click="test(item,keys)">新增</span>
        <span @click="test(item,keys)">删除</span>
    </div>
</table-tree>

data-list
- type: Array
- required: true
  对应的所以数据，参考demo.html
expanded
- type: String
- required: false
  是否有默认展开配置字段，该字段内存true的时候展开下级列表
parentKey
- type: String
- default:pid
  父节点字段名称
name
- type: String
- default:name
  展示的名称
left
- type: Num
- default:5
  默认下级的偏移距离