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 = ''
    }
  }
相关推荐
一只码代码的章鱼39 分钟前
Spring的 @Validate注解详细分析
前端·spring boot·算法
zimoyin1 小时前
Kotlin 协程实战:实现异步值加载委托,对值进行异步懒初始化
java·前端·kotlin
cdcdhj1 小时前
vue用通过npm的webpack打包编译,这样更适合灵活配置的项目
vue.js·webpack·npm
恋猫de小郭1 小时前
如何查看项目是否支持最新 Android 16K Page Size 一文汇总
android·开发语言·javascript·kotlin
赵大仁2 小时前
React Native 与 Expo
javascript·react native·react.js
程序员与背包客_CoderZ3 小时前
Node.js异步编程——Callback回调函数实现
前端·javascript·node.js·web
非凡ghost3 小时前
Pale Moon:速度优化的Firefox定制浏览器
前端·firefox
清灵xmf3 小时前
从 Set、Map 到 WeakSet、WeakMap 的进阶之旅
前端·javascript·set·map·weakset·weakmap
11054654014 小时前
11、参数化三维产品设计组件 - /设计与仿真组件/parametric-3d-product-design
前端·3d
爱笑的林羽4 小时前
Mac M系列 安装 jadx-gui
前端·macos