vue中使用的v-model在使用正则时不能正确读取值的问题(正则通过 oninput的方式写的)

使用了element组件
问题代码

<el-input v-model="ContractYear" oninput="if(value.length>2)value=value.slice(0,2);if(value.length > 21)value = value.slice(0,20)"style="display: inline-block" placeholder="年份（数字）" clearable :style="{width: '20%'}"></el-input>

使用的oninput 以及 oninput直接操作的value并没有直接操作v-model绑定的数据就是这里出现的问题
解决方案是 通过@input 以及直接操作v-model中绑定的值
改良后代码

<el-input v-model="ContractYear" @input="input"
style="display: inline-block" placeholder="年份（数字）" clearable :style="{width: '28%'}"></el-input>

input函数的内容

input(){console.log('触发了input')this.ContractYear = this.ContractYear.replace(/[^A-Z0-9]/g,'')if(this.ContractYear.length > 21{this.ContractYear = this.ContractYear.slice(0,20)}
},.

原因可能是 vue的数据双向绑定对原生的oninput的支持不是那么的完善

vue中使用的v-model在使用正则时不能正确读取值的问题(正则通过 oninput的方式写的)相关推荐

Vue中从v-model，model，.sync到双向数据传递，再到双向数据绑定
前面的话虽然v-model和.sync之间的区别,是非常明显的,但是通过这个去研究下去,就有点意思了.首先说明v-model是.sync的一种特殊情况,也就是当prop是value,vm.$emit ...
Vue中的@blur事件当元素失去焦点时所触发的事件
@blur 是什么? @blur 是当元素失去焦点时所触发的事件 @blur 怎么使用? <template><div><input type=&qu ...
Vue form表单input框手动赋值提交时表单input值没有生效验证仍然是空
一.问题 1.input 赋值后表单提交却为空在调用接口将返回的值赋在表单的 input 上或者子页面传递数值给父页面form表单model元素后,提交表单,明明值已经赋上去了,结果提交后显示的该值 ...
Vue 中 CSS 动画原理
下面这段代码,是点击按钮实现hello world显示与隐藏 <div id="root"><div v-if="show">hello ...
[vue] vue中怎么重置data？
[vue] vue中怎么重置data? 初始状态下设置data数据的默认值,重置时直接bject.assign(this.$data, this.$options.data())说明: this.$d ...
前端笔记-Vue中缺少router-view导致跳转失效
今天这个问题搞了我2个多小时,原因是我在App.vue里面把<router-view/>删除了,导致了跳转失败! 最后才发现,这个App.vue被改了,在此记录下,方便以后查阅! 这里个人 ...
vue鼠标移动上去提示_关于如何处理vue中鼠标悬停事件的详细说明
最后,在查看结果中,发现滑过鼠标事件将触发该事件,但它将闪烁并清除. 当鼠标停留在单元格上时鼠标滑过事件,遮罩层将消失并重复出现. 开关. 为了缓解这种情况,setTimeout也用于延迟显示和隐藏在 ...
Vue中key属性的作用
Vue中key属性的作用在列表渲染时使用key属性使用key属性强制替换元素在列表渲染时使用key属性相信大多数Vue开发者接触到key属性的时候是使用v-for进行列表渲染的时候,如果不使用 ...
vue中,静态书写select的option选项时如何设置默认选中项
@mishu vue中,静态书写select标签的option选项时如何设置默认选中项在vue框架下,给select标签使用v-model绑定数据时,我们的selected=''selected'' ...

vue中使用的v-model在使用正则时不能正确读取值的问题(正则通过 oninput的方式写的)

vue中使用的v-model在使用正则时不能正确读取值的问题(正则通过 oninput的方式写的)相关推荐

最新文章

热门文章