el-select加上搜索查询时,限制开头空格输入

**1、注释:**结构中的ref和@input.native很重要

javascript 复制代码
<el-form-item label="商品类型:" prop="productType">
   <el-select
     ref="eleSelect" //这里很重要1
     v-model.trim="formData.productType"
     placeholder="请选择"
     filterable
     clearable
     @input.native="trimSelect"  //这里很重要2
   >
     <el-option
       v-for="item in dictList.SPLX"
       :key="item.dictId"
       :label="item.dictLabel"
       :value="item.dictValue"
     ></el-option>
     
 </el-select>
</el-form-item>

2、js中限制开头为空格时重新赋值为空

javascript 复制代码
  // 开头为空格时重新赋值为空
  const eleSelect = ref()
  const trimSelect = ()=>{
    let regex = /^\s*$/;
    if(regex.test(eleSelect.value.selectedLabel)){
       eleSelect.value.selectedLabel = ''
    }
  }
相关推荐
姜太小白3 小时前
【前端】JavaScript字符串执行方法总结
开发语言·前端·javascript
GIS之路3 小时前
GDAL 实现影像合并
前端·python·信息可视化
心易行者3 小时前
Claude Code + Chrome:浏览器层面的AI编程新范式已至
前端·chrome·ai编程
半兽先生3 小时前
解决使用jsPDF实现表格数据导出pdf功能时中文乱码问题
前端·vue.js·elementui
qq_406176143 小时前
吃透JS异步编程:从回调地狱到Promise/Async-Await全解析
服务器·开发语言·前端·javascript·php
幻云20103 小时前
Python深度学习:筑基与实践
前端·javascript·vue.js·人工智能·python
@大迁世界3 小时前
停止使用 innerHTML:3 种安全渲染 HTML 的替代方案
开发语言·前端·javascript·安全·html
缘木之鱼4 小时前
CTFshow __Web应用安全与防护 第二章
前端·安全·渗透·ctf·ctfshow
沛沛老爹4 小时前
从Web到AI:多模态Agent Skills生态系统实战(Java+Vue构建跨模态智能体)
java·前端·vue.js·人工智能·rag·企业转型
子非鱼9214 小时前
Vue框架快速上手
前端·javascript·vue.js