elementUI 中el-select option支持自定义样式,只需在el-option标签中写需要的样式就行了;以下使用官方列子进行举例:
html:
<el-select v-model="value" filterable placeholder="请选择0" filterable :filter-method="(value) => query(value, oldOptions)">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
<span style="float: left;">{{item.label}}</span>
<span style="float: right;color: #ccc;">{{item.value}}</span>
</el-option>
</el-select>
下图是自定义样式写入位置:
js中data部分:
options: [{
value: '选项1',
label: '黄金糕'
}, {
value: '选项2',
label: '双皮奶'
}, {
value: '选项3',
label: '蚵仔煎'
}, {
value: '选项4',
label: '龙须面'
}, {
value: '选项5',
label: '北京烤鸭'
}],
value:''
效果如下: