el-option点击传id事件
时间: 2023-07-06 10:33:25 浏览: 86
Vue + Element-ui的下拉框el-select获取额外参数详解
您可以在el-option标签上添加@click事件,然后在事件处理程序中使用$emit方法将选项的id值传递给父组件,示例如下:
```html
<el-select v-model="selectedOption">
<el-option v-for="option in options" :key="option.id" :label="option.label" :value="option.id" @click="handleOptionClick(option.id)"></el-option>
</el-select>
```
```javascript
methods: {
handleOptionClick(id) {
this.$emit('option-clicked', id);
}
}
```
在父组件中,您可以监听'option-clicked'事件来处理选项的id值,示例如下:
```html
<template>
<div>
<el-select @option-clicked="handleOptionClicked">
<el-option v-for="option in options" :key="option.id" :label="option.label" :value="option.id"></el-option>
</el-select>
</div>
</template>
```
```javascript
methods: {
handleOptionClicked(id) {
// 处理选项的id值
}
}
```
阅读全文