ElementUI Select 选择器

ElementUI Select 选择器创建新条目后直接选中

ElementUI Select 选择器配置allow-create后，可以创建新条目，但需要额外去点击新的条目才能选中，现在需要在下拉框失去焦点后直接选中新建条目。

无法直接通过在el-select组件上监听blur事件来实现，需要监听blur.native.capture事件。

另外需要通过filter-method获取到输入值保存在临时变量中，在失去焦点时再赋值给绑定的变量。

示例：

<template>
  <el-select v-model="value" filterable allow-create @filter-method="handleFilter" @blur.native.capture="handleBlur">
    <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
  </el-select>
</template>
<script>
export default {
  data() {
    return {
      options: [
        {
          value: "选项1",
          label: "黄金糕",
        },
        {
          value: "选项2",
          label: "双皮奶",
        },
        {
          value: "选项3",
          label: "蚵仔煎",
        },
        {
          value: "选项4",
          label: "龙须面",
        },
        {
          value: "选项5",
          label: "北京烤鸭",
        },
      ],
      value: "",
      tempValue: "",
    };
  },
  methods: {
    handleFilter(value) {
      this.tempValue = value;
    },
    handleBlur(e) {
      this.value = this.tempValue;
      this.tempValue = "";
    },
  },
};
</script>