【前端页面】如何删除列表中的元素

删除列表中的元素

最近接到一个编写评价页面的任务，在任务中，需要上传用户晒的图，当然也要有能删除用户上传的图的功能

我对元素是进行的push进的列表中，最开始我想的方法是对列表进行pop操作，但是这样我不能控制删除的元素，经过查询资料，我找到了方法，就此记录一下，免得下次在遇到类似的问题再去查资料（笑）

首先是找到元素本身，这里使用一个方法来查找
假设item是要删除的数组

// 这是uni-app的写法, 
findTarget:function(val){
    for(let i = 0; i < item.length; i++){
        if(item[i] == val) return i;	// 判断传入的数据是否和列表中的数据匹配
    }
        return -1;
}

接下来删除这个元素

deleteImg: function(val){
    var index = this.findTarget(val);
    if(index > -1){
        this.item.splice(index,1);
    }
}

这里主要是使用了splice方法对元素进行分割

这里顺便说说我自己对splice方法的理解

在w3c School中的定义是：splice() 方法向/从数组中添加/删除项目，然后返回被删除的项目。 注释：该方法会改变原始数组。

splice可以对数组进行删除，也可以对数组进行添加新元素（目前我还没有使用到添加新元素的操作）
这里使用的splice()方法需要两个参数，第一个参数是目标位置，也就是你想要操作的位置；第二个参数是要删除的的数量。

如上面的代码中splice(index,1)，意思就是删除index位置的1个元素

问题解决！

拒绝摸鱼划水，记录成长~