vue中的删除按钮的做法

vue中的删除按钮的做法

list这个数组是我们在data里定义好的，事先说明
功能：vue中删除一条数据
[https://blog.csdn.net/qq_43714712/article/details/118993753]如果有不知道这个方法的去看，还有其他数组的方法
1、用id,真实的工作中，一般会选择具有唯一性的id
在定义点击函数时，传一个遍历出来的真实id

delFn(id) {//形参，用于接受真实id的  
      let index;//定义一个变量，当作索引
      for (let i = 0; i < this.list.length; i++) {//遍历数组，这里的数组是你定义过的数组=数据，所以用this.在方法里
        if (this.list[i].id == id) {//让数组遍历出来的id和这里的形参id（其实就是真实的id）进行比较
          index = i;//相等，返回true，我们让这时的i(索引)赋值给你定义的index这个变量
        }
      }
      this.list.splice(index, 1);//这时就能直接用数组的删除方法,因为这里的index就是和你对应一条数据的索引（一对一）
    },

2，平常的练习可以用索引直接删除，非常简单

直接在点击事件里写（**注意：**这里不需要加this）

 @click='list.splice(index, 1);'

也可以让点击事件等于一个函数,因为函数中有可能还写其他效果

delFn(index){//形参（实参是你上面结构中传入的，所以记得传）
	this.list.splice(index, 1)
}