VUE+Element el-input输入车牌号大小写自动转换

VUE+Element el-input输入车牌号大小写自动转换
使用vue+element搭建项目,在el-form组件中,可能会遇到需要限制用户输入的类型
而车牌号的输入应该是很普遍存在的
你也不可能要求用户的输入方式,这就导致后端接口接受到的数据可能是"鄂a12345"
所以,在el-input组件上可以使用computed计算属性去处理一下input的value
代码如下:

  <el-form-item label="设备编号/车牌号" prop="number">
      <el-input :disabled="disabled" v-model.trim="shortCodeUpperCase" placeholder="请输入设备编号"></el-input>
  </el-form-item>
// 使用计算属性处理value
computed: {
    shortCodeUpperCase: {
      get() {
        return this.inputVal;
      },
      set(val) {
        this.inputVal = val.toUpperCase();
        // 该input真正对应的字段:this.form.number
        this.form.number = this.inputVal
      },
    },
  }
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。