账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    如何用vue通过for的循环下标一次删除多个数据
    18
    0

    初学vue,尝试制作一个tudolist的小工具,使用localStorage来缓存之前的记录。
    然后做了一个删除已完成的功能,使用下标来选择被选中的数据。但是遇到一个问题,如果我在循环中判定被选中,然后根据下标删除。使用this.li.splice()方法时,每次删除都会改变下标,会导致多个删除错误。后来我使用另一个数组存储被选中的数组,然后使用splice($inArray(i,this.li),1)这样来实现,也发现一个致命问题,如果有相同的内容,就无法准确定位。最后使用了delete方法,先将值置空,然后在设置循环来删除空值。
    说了这么多我想问有没有比较直接的方法来删除被选中的元素,还有希望大家给我解答一个问题。如果说vue目的是使用数据来控制显示,那么是否遇到类似的问题都需要遍历来实现吗?有没有一种类似于jq可以选中this的方法。
    下面贴下代码

    HTML部分代码

    <li v-for="(i,index) in li"
            class="list"
            :class="{'active':color[index]}">
            <div class="lists">
                    <span>
                        {{i}}
                    </span>
            </div>
            <div @click="check(index,i)" class="end">
                    <span >
                        {{ms[index]?a:b}}
                    </span>
            </div>
     </li>
    
    ## js部分代码 ##
                
    

    这是之前的想法,有这重复出错的错误

                /* var val=[];
                for (var i in this.color){
                    if (this.color[i]==true||this.color[i]=="true"){
                        console.log(i)
                        val.push(this.li[i])
                    }
                }
                for (var i=0;i<val.length;i++){
                    this.li.splice($.inArray(val[i],this.li),1);
                    console.log(val[i])
                }
                this.color=[];
                localStorage.setItem("localname",this.li);
                localStorage.removeItem("localcolor");
                this.ms =[];
                this.s = []*/
    

    这是更新以后应该不会出错的代码

                for (var i in this.color){
                    if (this.color[i]==true||this.color[i]=="true"){
                        delete this.li[i]
                    }
                }
                for (var i=0;i<this.li.length;i++){
                    if (this.li[i]==''||this.li[i]==undefined){
                        this.li.splice(i, 1);
                        i-=1;
                        console.log(this.li)
                    }
                }
                this.color=[];
                localStorage.setItem("localname",this.li);
                localStorage.removeItem("localcolor");
                this.ms =[];
                this.s = []*/
    
                
               
    0
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 浪客落尘 普通会员 1楼
      502 Bad Gateway

      502 Bad Gateway


      nginx
    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部