el-select 可选择可输入

本文共 514 字,预计阅读时间 2 分钟

一般情况下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 @   钟小嘿  阅读(3839)  评论(0编辑  收藏  举报
编辑推荐:
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
阅读排行:
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· 没有Manus邀请码?试试免邀请码的MGX或者开源的OpenManus吧
· 【自荐】一款简洁、开源的在线白板工具 Drawnix
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
· Docker 太简单,K8s 太复杂?w7panel 让容器管理更轻松!
点击右上角即可分享
微信分享提示