element-ui table组件编辑后数据更新视图不更新

记录今天遇到的一个小bug

使用el-table实现表格的增删改

在这里我的表格数据源绑定的是rolesList，选中的当前行是role；我们将所需的信息打印出来

可以看出我当前的数据已经更改，但我的视图信息并没有更改，查找解决方案后尝试了给表头增加一个row-key=“id”，确保每一行的id是唯一的，仍然不行。(这个建议大家先进行尝试)

最终解决方案：发现是由于我的数据结构的问题，我是用的是数组，我通过this.role改变的只是数组指向的那个数据，但数组指向的地址并没有发生更改，也就是说数组本身并不知道自己发生了改变。
最后加了一句这个解决。因为splice方法处理后的数组会将数组处理结果返回给原数组。所以相当于显示的提醒数组进行了更新。

this.rolesList.splice(1,0);

tips：数组变为逗号相隔的字符串并且去掉末尾的逗号

	  let str = ''
      this.checkData.forEach(item => {
        str += item + ', '
      })
      this.editForm.role = str.substring(0, str.lastIndexOf(','))