zoukankan      html  css  js  c++  java
  • 阻止复选框默认冒泡事件

    <input  type="checkbox"  v-on:click.prevent="onClick"  />
    

     数组渲染因为下标问题,导致点上一个复选框拿走数据之后,下一个数据的复选框状态会改变,所以通过prevent去阻止事件的冒泡。让复选框依然是数据的原本状态,这是第一种解决办法。

    第二种解决办法就是直接找到checked重新改成true状态

    <template>
          <div v-for="(item,index) in list"  :key="index">
                <input type="checkbox" :checked="item.state" v-on:click="onClick(index)" />
          </div>
    <template/>
    <script>
        export default{
         data(){
              return{
                 list:[
                      {id:1,state:true},
                      {id:2,state:true},
                      {id:1,state:true},
                      {id:1,state:true}
                      ]
               }
            },
         methods:{
              onClick(i){
                  this.list.splice(i,1);
                 //通过event 找到状态重新改成原来的true
                  window.event.target.checked=true;
               }
            }
            }
    </script>
        
    

      

     

  • 相关阅读:
    面向对象与类
    引用数据类型
    方法
    java for 语句的用法
    java 数组
    Scanner与Random
    java基本语法
    java介绍及安装。
    数据库设计
    NFS相关、NFS服务端安装配置、exportfs命令、nfs客户端的问题
  • 原文地址:https://www.cnblogs.com/xiaobu-wu/p/12770588.html
Copyright © 2011-2022 走看看