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不是同一种类型的值,需根据实际情况进行调整。

就是这么简单,你学废了吗?感觉有用的话,给笔者点个赞吧 !
原文地址:https://www.cnblogs.com/zys2019/p/15504412.html