如何设置Vue Element UI中el-option组件被选中时对应的item背景颜色？

在Vue Element UI中，`el-option`组件代表下拉列表中的选项。若想在某个选项被选中时改变其背景颜色，你可以通过自定义渲染函数（render-method）来自定义外观。以下是步骤：

1. 首先，在Vue实例中创建一个包含选项的数组，每个option对象可以包含一个额外的属性如`selectedColor`表示选中时的颜色：

export default {
  data() {
    return {
      options: [
        { value: 'Option 1', label: 'Option 1', selectedColor: '#ffcc00' },
        { value: 'Option 2', label: 'Option 2', selectedColor: '#64b5f6' },
        //...
      ]
    };
  }
};

2. 然后在`el-select`组件的`render-option`选项中，提供一个自定义渲染函数：

<template>
  <el-select v-model="value" style="width: 200px;">
    <el-option
      v-for="option in options"
      :key="option.value"
      :label="option.label"
      :value="option.value"
      :selected-class="{ background-color: option.selectedColor }"
      @click="onSelect(option)"
    ></el-option>
  </el-select>
</template>

<script>
//...
methods: {
  onSelect(option) {
    // 如果你想在用户手动选择时改变背景色，可以在这里处理
    this.value = option.value;
    option.isSelected = true; // 假设选项对象有一个isSelected属性标记当前选中状态
  }
}
//...
</script>

在这个例子中，`selected-class`属性接受一个对象，其中`background-color`会覆盖默认的选中样式的背景颜色。当`el-option`被点击时，`onSelect`方法会被触发，你可以在这里更新选项的状态和视图。

注意，由于Element UI并未直接提供一种方式完全控制选项的选择样式，因此这种方法可能会有一些限制，尤其是如果它依赖于Element UI内部的复杂选中逻辑。