问题
项目中，我们一般会对 Element 进行二次封装，因为这样更好的全局管理组件，一处改动即可全局改动。比如你有十个表格，因为表格需要新增一个小功能（比如：右上角新增一个控制列显示的按钮），这时候你需要改动十次，如果你的表格全是应用你的组件，那么只需改动一次。后续我将会出文章更加详细进行讲解，点个关注吧。
项目中对表格的封装的时候发现，表格的第一行总会跑到最后一行去（只要使用了 v-if 进行列控制渲染）。如图所示：
代码如下：
可以看见我们为了循环，在 table 里面放置了 div 标签，但是这其实是不合法的，table 标签中不应该出现不属于 table 的标签，出现了也会被屏蔽掉，但是这也是导致上述结果的原因。
解决方法
- 使用 template 标签，template 标签不会被渲染出来，而内部则可以渲染出来，v-if 实现原理也是来自于此。
- 将 key 值进行下放，在 template 中是不允许使用 key 值（因为没有意义，template不是一个真实的标签）。
代码如下：
出来的结果如下：
延伸问题
细心的朋友（列文虎克们）可以回发现复选框其实是没有对准的，在控制台查看样式表后，发现经过多次样式写入，复选框表头 padding-right 总是会多一点点，并且这个值以及其他 padding是固定的，那么我们就手动进行纠正吧（欢迎评论指出原因）。
代码如下：
注意：这里使用了样式穿透，而样式穿透有多种写法，这里只建议使用 ::v-deep，因为这是官方推荐写法，而 >>> 和 /deep/ 都会在一定场景下失效（具体可以百度，例如：项目中没有使用 node-sass，而是使用的其他支持 sass 的插件，因为 node-sass 下载太慢了）。
至此问题解决：
