【组件推荐&改造】vue实现的tree grid 树形表格

因业务需要，我需要一个树形表格，类似这样的：

然而iview中的table是这样的：

其实，准确的来说，iview中的表格并不是树形表格，只是用于展开显示每一行的更多信息；

在网上找了一圈，发现有位大佬用vue封装的iview风格的树形表格（vue-table-with-tree-grid），在此基础上我又进行了一些调整和优化：

1. 增加节点图标；

2. 可以自定义展开的节点；（原版本只能默认全部节点展开或者全部折叠）；

效果如下：

API参考原作者的npm描述：https://www.npmjs.com/package/vue-table-with-tree-grid

这里只说明新增的 自定义默认展开节点功能 如何使用：

优先级：全局配置 is-fold > 节点数据 fold 字段

如果要自定义默认展开的节点，首先不能设置is-fold字段，然后节点数据 字段 fold 设置true/false;

如：

data: [
  {
	name: 'Jack',
	// 展开节点
	fold: false,
	children: [
	  {
		name: 'Ashley',
		// 折叠节点
		fold: true,
		children: [
		  {
			name: 'Ashley'
		  },
		],
	  }
	],
  }
 ]

 npm：https://www.npmjs.com/package/vue-table-with-tree-grid-icon

github：https://github.com/connie1992/vue-table-with-tree-grid-icon

可以把代码down下来看demo会比较清楚一些。