el-select 可选择可输入

一般情况下el-select只做选择使用,但也有场景,没有选项时可手动输入值进行保存。只需给其加一个blur的方法,用法如下:

页面代码:

 <el-select v-model="form.sex" placeholder="" filterable @blur="selectBlur">
       <el-option v-for="(item, index) in sexOptions"
                :label="item.name"
                :value="item.code"
                :key="index"
       ></el-option>
</el-select>

js代码:

 methods: {
    selectBlur(e){
      this.form.code= e.target.value
    }
}

上述演示的代码是没有问题的,但数据存储是有问题的,因为其code不是同一种类型的值,需根据实际情况进行调整。

 

posted @ 2021-11-05 19:59  钟小嘿  阅读(3627)  评论(0编辑  收藏  举报