iview table的render函数中利用index参数设置当前行的特征

iview框架的中table组件的render函数真是奇幻无比啊。之前我也发了一篇关于render函数的一般用法。
这篇要讲的是render函数index参数能用在什么地方。
例如说我用render函数写一个按钮，想点击按钮时出现loading加载状态,1s后loading状态自动消失，如果在loading属性直接绑定一个data的值，会整列的按钮都出现loading状态，如下图：

 

image.png

 

image.png

那人该如何让当前点击的按钮动态的添加自己有标志性的loading属性呢？
table的render函数有3个参数，来段官网的原句：
render 函数传入两个参数，第一个是 h，第二个是对象，包含 row、column 和 index，分别指当前单元格数据，当前列数据，当前是第几行。
现在就该用到index参数了。
优化思路：
1.给data6数组的每个对象添加一个字段，该字段的值为布尔值。例如我在这里设置isBlue = false；
2.该字段的值用来作为loading属性的值。例如loading：isBlue；
3.点击该按钮时，用index作为data6索引值，取到该索引下的isBlue值。例如data6[index].isBlue是不是就能取到该点击按钮的isBlue值啦；
4.既然能取到该点击按钮的isBlue值，而该值是loading属性的，那控制isBlue的值是不是就等于控制了loading属性的值

来看看下面代码：

 

image.png

image.png

这样就可以啦，效果图就不贴了。
如果改个需求，我想要点击某个按钮时改变该按钮颜色，再点击时改回原来的颜色，这需求跟前面个设置loading状态的是不是同个套路啊，同样是利用index参数来判断当前点击的是哪行，如下代码：

 

image.png

image.png

转载：https://www.jianshu.com/p/16a9db44266e