JavaScript数组的增删改在Element table中的运用

增加:Array.prototype.push(element1...)

修改和删除:Array.prototype.splice()

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/splice

定义

通过删除现有元素和/或添加新元素来更改一个数组的内容。

语法

array.splice(start)
array.splice(start, deleteCount)
array.splice(start, deleteCount, item1, item2, ...)

参数

start
数组的开始位置
deleteCount [可选]
移除数组元素的个数。如果不指定则
item1, item2, ... [可选]
从start的位置开始添加元素。如果不指定则只删除元素

例子

由于 JavaScript 的限制， Vue 不能检测以下变动的数组：

• 当你利用索引直接设置一个项时，例如： vm.items[indexOfItem] = newValue

所以我们想改变table中第一条数据的值，通过this.list[0]=newValue这样是不会生效的。

解决方案：

// Array.prototype.splice`
example1.items.splice(indexOfItem, 1, newValue)

//添加数据
this.list.unshift(this.temp);

//删除数据 
const index = this.list.indexOf(row); //找到要删除数据在list中的位置
this.list.splice(index, 1); //通过splice 删除数据

//修改数据
const index = this.list.indexOf(row); //找到修改的数据在list中的位置
this.list.splice(index, 1,this.updatedData); //通过splice 替换数据 触发视图更新