el-input有内容时改变背景色为红色

`el-input`是Element UI库中的输入框组件，如果你想让这个输入框在有内容时改变其背景色为红色，你可以通过给它添加自定义样式。首先，你需要确保已经引入了Element UI并设置了相应的CSS变量。然后，在Vue组件中，你可以利用v-model绑定值并在CSS中监听这个值的变化。

在HTML模板部分：

<el-input v-model="inputValue" @input="updateBgColor"></el-input>

在JavaScript部分（Vue实例中）：

export default {
  data() {
    return {
      inputValue: '',
    };
  },
  methods: {
    updateBgColor(e) {
      if (e.target.value !== '') {
        this.$refs.inputEl.style.backgroundColor = 'red'; // 使用ref引用input元素
      } else {
        this.$refs.inputEl.style.backgroundColor = ''; // 清除颜色，如果没有内容则还原
      }
    },
  },
};

在这里，我们使用了`$refs`来获取到`el-input`的实际DOM元素，并在其值非空时设置背景色为红色，当值为空时恢复默认背景。