前端vue项目通过iview组件库实现嵌套table表格

首先展示效果图，如下：

 很多时候我们要实现table表格的当前行下面也展示table表格出来，并且是完全独立的表头，那么就要使用iview组件库中的table表格的column属性中的type: 'expand',才可以展开下一层，如下图

 但是仅仅添加了expand属性是不够的，目前可以展开下一层级，但是下一层级里的内容是空白的，需要我们自己定义内容，对于我们要渲染表格来说，此时告诉大家一个小坑，就是我们通过render函数直接渲染“Table”是无效的，我发现怎么尝试，连表头都渲染不出来，更别提下面的数据了（也有可能是我还没有发现这样渲染的方法），因此经过很多渲染方式的尝试之后，我发现了一种可行的办法，就是通过自定义组件，再通过render函数来渲染自定义组件，而不是渲染Table标签，如下：

 此时又遇到另外一个坑，就是传值问题，一般情况下，我们通过render函数渲染的组件，如果要传值，我们都是使用props传值的，但是在这里不行，在子组件中通过props接收不到，因此在这里传值需要如上图所示，直接定义变量进行赋值，在子组件中直接通过props就可以接受到。

因此总结最重要的两点：第一：通过自定义的组件进行渲染，可以正常渲染出表格；第二：不要在render函数中通过prop传值，只需要直接定义变量进行赋值就好，子组件中才可以才props中获取到传过来的值；有了表格，又有了数据，此时表格不就可以正常渲染了吗，关于二级表格里面的操作，全都放在自定义组件里面去操作就可以了，完美解决，而且一点也不复杂。