Iview表格不同色块区别显示

    组件一般自带斑马纹和色块，但是有些需求就会要求同一个表格有不同的色块显示，同时不同色块的斑马纹和字体也不一样。
   该博客就是针对iview组件库的表格的。

   先贴展示图，
   ![效果图](https://www.icode9.com/i/ll/?i=2020120115482866.png?,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0hhY2tlckRyZWFtZXJfQlNE,size_16,color_FFFFFF,t_70)
  不同色块，不同斑马纹，不同字体。

 首先是表头部分，通过在iview表格的列属性内，添加className属性，绑定相应的类名，在下面使用对应的方法，
 
 ![在这里插入图片描述](https://www.icode9.com/i/ll/?i=20201201154941687.png?,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0hhY2tlckRyZWFtZXJfQlNE,size_16,color_FFFFFF,t_70)

 而斑马纹部分，使用的是render方式渲染的，字体也是。
 ![在这里插入图片描述](https://www.icode9.com/i/ll/?i=20201201155123627.png)
 
 再在对应的地方写上css样式
 ![在这里插入图片描述](https://www.icode9.com/i/ll/?i=20201201155210802.png)
 
 这样就可以实现了。

标签：色块,cn,img,表格,blog,csdnimg,https,Iview
来源： https://blog.csdn.net/HackerDreamer_BSD/article/details/110436926