[vue3 element-plus]当事件需要传递多个参数的变化写法

ops/2024/10/30 7:52:13/

需求背景:

需要完成购物车的单选功能。

单选框使用el-checkbox。

通过el-checkbox我们可以通过默认参数获得是否选择。

javascript">const changeSelected = (selected) => {console.log(selected)
}<el-checkbox :model-value="i.selected" @change="changeSelected" />

我们之间就可以拿到checkbox是否check的值

但是因为checkbox是用v-for渲染的,所以我还要知道我拿到了哪个check-box

这时候,我们就要多传一个参数,用于获取哪个check-box

如果我们这样写,会直接覆盖默认参数。

javascript"><el-checkbox :model-value="i.selected" @change="changeSelected(i)" />

那怎么写能既保留默认参数,并且传递额外的参数呢?

javascript"><el-checkbox:model-value="i.selected"@change="(selected) => singleSelected(i, selected)"
/>

通过这种写法可以保留默认参数


http://www.ppmy.cn/ops/129524.html

相关文章

HTML小阶段二维表和思维导图

下面是对标签、元素、属性的对比二维表&#xff0c;通过对比3w1h&#xff08;what是什么、where用在哪、why为什么要用、how如何用&#xff09;来学习区分学习标签、元素、属性 标签 元素 属性 what &#xff08;Tags&#xff09;标签是用来标记内容块或标明元素内容意义 …

【C++初阶】一文讲通C++内存管理

文章目录 1. C/C内存分布2. C语言中动态内存管理方式3. C内存管理方式3. 1 new/delete操作内置类型3. 2 new和delete操作自定义类型 4. new与delete的原理4. 1 operator new与operator delete函数4. 2 内置类型4. 3 自定义类型 5. 定位new表达式(placement-new)6. malloc/free和…

java 泛型返回接口

1.小练习 去除ArrayList中重复字符串元素 public static ArrayList<String> getSingle(ArrayList<String> list){ArrayList<String> newList new ArrayList<String>();Iterator<String> itr list.iterator();while (itr.hasNext()) {String o…

Soft TeacherEnd-to-End Semi-Supervised Object Detection with Soft Teacher

Soft Teacher:End-to-End Semi-Supervised Object Detection with Soft Teacher 论文&#xff1a;End-to-End Semi-Supervised Object Detection with Soft Teacher Abstract ​ 相较于之前更复杂的多阶段方法&#xff0c;本论文提出了一个端到端的半监督目标检测方法。这个…

Amcor 如何借助 Liquid UI 实现SAP PM可靠性

背景介绍 安姆科是塑料行业的全球领军企业&#xff0c;该企业认识到 SAP 工厂维护&#xff08;SAP PM&#xff09;对于确保高效的维护管理的重要性。 在诸如制造业等高度依赖机械设备的行业中&#xff0c;SAP PM是一种通过数据驱动决策来最大限度减少停机时间、降低间接成本、…

Java基础-JVM

JVM构成部分 类加载系统 类加载子系统的作用是将磁盘中的.class文件加载到内存当中。工作过程如下&#xff1a; 加载&#xff1a;通过类全路径名获取二进制字节流&#xff1b;将这个二进制字节流代表的数存储构转化为方法区运行时数据结构&#xff1b;在内存生成一个代表该类的…

git clone完整使用手册

git-clone - 将一个仓库克隆到一个新目录中 用法 git clone [--template<模板目录>][-l] [-s] [--no-hardlinks] [-q] [-n] [--bare] [--mirror][-o <名称>] [-b <名称>] [-u <上传包>] [--reference <仓库>][--dissociate] [--separate-git-d…

Python毕业设计选题:基于Web学生会网站的设计与实现-django

开发语言&#xff1a;Python框架&#xff1a;djangoPython版本&#xff1a;python3.7.7数据库&#xff1a;mysql 5.7数据库工具&#xff1a;Navicat11开发软件&#xff1a;PyCharm 系统展示 系统首页界面 用户注册界面 用户登录界面 校内报道界面 品牌活动界面 个人中心界面 …