elementui选择框动态改变选项的style属性
时间: 2023-10-13 09:28:10 浏览: 87
修改elementUI的样式
可以使用 elementui 的 $refs 属性来获取到选择框并动态修改其样式属性。以下是一个示例代码:
```html
<template>
<div>
<el-select v-model="selectedValue" ref="select">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
</el-select>
</div>
</template>
<script>
export default {
data() {
return {
selectedValue: '',
options: [
{ value: 'option1', label: 'Option 1' },
{ value: 'option2', label: 'Option 2' },
{ value: 'option3', label: 'Option 3' }
]
}
},
mounted() {
// 获取到选择框
const select = this.$refs.select.$el.querySelector('.el-select-dropdown__item')
// 修改样式属性
select.style.color = 'red'
select.style.background = 'yellow'
}
}
</script>
```
阅读全文