vue2：el-select中的@change事件如何传入自定义参数

我是飞鸟呀

已于 2024-12-16 17:09:57 修改

阅读量2.6k

点赞数 6

CC 4.0 BY-SA版权

分类专栏： Vue 文章标签： javascript 开发语言 ecmascript

于 2024-12-06 18:30:00 首次发布

本文链接：https://blog.youkuaiyun.com/l_q_l/article/details/144255830

Vue 专栏收录该内容

59 篇文章 ¥19.90 ¥99.00

订阅专栏

在 Element UI 中，el-select 组件用于创建一个下拉选择框。当选项发生变化时，你可以使用 @change 事件来监听这个变化。默认传入的是选中项的值（如果是多选，则传入一个数组）

但是有些时候需要传入额外的自定义参数，可以通过如下方式实现

1、template中定义事件响应函数时，指定选中项值的参数名称。如下：通过（newVal）指定参数‘newVal’为传入的选中项，那么另一个参数row即是传入的自定义参数。

<el-select
    v-model="form.query1[index].field"
    placeholder="请选择查询参数"
    @change="(newVal) => handleField1Change(row, newVal)"
>
   <el-option
       v-for="item in fieldOptions"
       :key="item.field"
       :label="item.label"
       :value="item.field">
   </el-option>
</el-select>

2、函数实现

了解本专栏