需求: 勾选或 取消勾选复选框需要拿该条数据id 做某些操作 实时保存,删除等等操作

但是我搜索到网站上没有关于获取到当前选中或取消这一条的数据的状态(是取消勾选 还是勾选)所以写这篇文章 

上代码  我们都知道 checkList是绑定的选中的数据数组

 <div class="card-item" :class="{ 'active': layerActiveIndex == index }"
       v-for="(item, index) in dataList" :key="index">
   <el-checkbox-group v-model="checkList" @change="checkChangeFn(item.id, index, item)">
        <el-checkbox :label="item.id">
         <span style="width: 100%;">{{item.layer_desc }}</span>
        </el-checkbox>
    </el-checkbox-group>
 </div>

 然后根据传入id参数判断是否存在 是勾选还是取消勾选


        checkChangeFn(checkedValue, index, item) {
            // 获取当前操作的复选框的选中状态
            const checked = this.checkList.includes(checkedValue);
               if (checked) {
                        //勾选
                }else{
                        //取消勾选
                }

        }

其实这篇文章是我混流量券的哈哈哈哈哈 因为我快几个月没有写文章了(最近在忙一个新的低代码的可视化拖拽的平台 后面如果开发完毕我再会将开发中遇到的问题一一记录下) 抱拳

GitHub 加速计划 / eleme / element
10
1
下载
A Vue.js 2.0 UI Toolkit for Web
最近提交(Master分支:4 个月前 )
c345bb45 8 个月前
a07f3a59 * Update transition.md * Update table.md * Update transition.md * Update table.md * Update transition.md * Update table.md * Update table.md * Update transition.md * Update popover.md 9 个月前
Logo

旨在为数千万中国开发者提供一个无缝且高效的云端环境,以支持学习、使用和贡献开源项目。

更多推荐