iview使用之怎样经过render函数在table组件表头添加图标及判断多个状态

  在实际项目开发中，咱们常常会用到各类各样的表格，好比在表格中填加下拉菜单，按钮，图标及能够根据状态显示对应文字等等，由于这段时间一直在作后台管理系统，因此表格用的就比较多，固然UI组件库我用的是iview,PRD(原型图)上的表格要求要能够判断多个状态及在表头上添加图标，在网上搜了一段时间发现比较少，因此写好以后就想着分享出来给有须要的人参考参考，例以下面这种表头带图标的：

这种表格相信你们都会以为在iview里有，，其实是没有的，并且可能也会有人以为经过iview的render函数就是添加，可是这只是想对了一半，对于iview表格组件的tbody部分确实是能够经过render函数来进行修改，可是仅仅是针对tbody部分，对于表头则是经过renderheader进行一个修改，具体代码以下：

接下来就是关于iview表格多个状态的判断，，通常状况下，咱们只须要对两个状态进行判断，因此用简单的三目运算符就能够实现，但有时候可能会有多个状态，好比我此次的项目，基本都是五个状态，处理起来稍微麻烦一点，不过最终我仍是写出来了，分享一下：

这里面的status是后台传给你的状态，到本身的项目对号入座就好了，而后是格外用了一个iview的Tag标签，美观一点，，哈哈，，效果以下：

在使用iview表格的时候还有一个问题须要注意，就是关于表格列宽自适应的问题，若是不是特别要求，建议不要给每一列设置宽度，这样反而会致使表格在大屏或者小屏幕下出来空白的状况，因此建议是不要设置固定宽度，就这样，但愿能够帮到有须要的人，共勉！！！