el-select怎么同时获取选中项的name,value值
时间: 2023-07-16 18:15:31 浏览: 93
你可以使用 `v-model` 来绑定选中项的值,然后通过监听 `change` 事件来获取选中项的 `name` 值。例如:
```html
<el-select v-model="selectedValue" @change="handleSelectChange">
<el-option label="Option 1" value="option1" name="Option 1"></el-option>
<el-option label="Option 2" value="option2" name="Option 2"></el-option>
<el-option label="Option 3" value="option3" name="Option 3"></el-option>
</el-select>
```
在 Vue 实例中定义 `selectedValue` 和 `handleSelectChange` 方法:
```javascript
data() {
return {
selectedValue: ''
}
},
methods: {
handleSelectChange(value) {
const selectedOption = this.$refs.select.getOption(value);
const selectedName = selectedOption.name;
console.log(`selectedValue: ${value}, selectedName: ${selectedName}`);
}
}
```
这里通过 `$refs.select.getOption(value)` 方法来获取选中项的 `name` 值。注意要给每个 `el-option` 设置 `name` 属性。
阅读全文