在使用 splice( ) 删除数组最后一个元素的时候，发生 Cannot read properties of undefinde(reading 'name') 错误。name属性的前面的属性是一个undefined。
错误如下：
代码如下：
将数组中的数据渲染
Vue中的数据
处理函数
问题：唯有删除最后一个数组元素的时候报错，确定过其他的功能模块不会出错，最后将目光放在执行删除的模块中，发现由 splice( )引起。
我的想法是：当前点击的 ‘删除按钮‘ 的索引，与在 data中的arr索引的数据对应一致，二者的索引都代表同一项元素，在点击删除的时候调用 alert_del方法（48行） ，获取 index 将其赋值给arrIndex（211行,ps:201行arrindex的值是一个默认值），在执行 ’确认‘ 删除的时候，报如下的错误：Cannot read properties of undefinde(reading 'name')。
原因在于：（ps:所有的标签都在 #app 中）
在执行删除最后一个的时候，索引为2，传入了 alert_del（index）（207行）中，当中影响了arrIndex的值，再通过del（e）（215行）中的 this.arr.splice(this.arrIndex,1).
理论上没有错，执行到 删除数组元素的操作，数组确实是删除了，会报错的原因在于 第 168行中，{{ arr[arrIndex].name }}, name的前面是一个undefined 的值，导致。
因为，arrIndex此时为2，而数组删除操作会使得 数组的长度 减1，也就导致了越界，索引超出的情况。在 第38行中，是一个遍历的操作， arr[arrIndex].name 实际上 arr[2].name，这就是问题，数组的长度只有2（ arr[0],arr[1] ）。 去访问一个不存在的元素。
解决方法：第 168 行 {{ del_name }} ，203行 定义一个 del_name 属性、 212 行 this.del_name = this.arr[this.arrIndex].name;
单独的获取要删除的元素的name , 不要尝试在数组中遍历对应的name（数组被执行删除操作，索引会发生变化）