el-input在vue中实现禁⽌输⼊特殊字符
前提补充
在vue中
<input v-model="text" />
等价于
<input
:value="text"
@input="e => text = e.target.value"
/>
需求
前端提交form表单要求,不能输⼊ @#¥%……&*…
不是提⽰,⽽是禁⽌输⼊
效果
代码
** 在mian.js中添加【vue原型上添加⽅法,便于全局使⽤】
Vue.prototype.validForbid = function (value, number = 255) {
value = place(/[`~!@#$%^&*()_\-+=<>?:"{}|,./;'\\[\]·~!@#¥%……&*()——\-+={}|《》?:“”【】、;‘’,。、]/g, '').replace(/\s/g, ""); if (value.length >= number) {
this.$message({
type: "warning",
message: `输⼊内容不能超过${number}个字符`
});
}
return value;
}input框禁止输入
** 在component.vue中加⼊
<el-input
:value="form.name"
@input="e => form.name = validSe(e)"
maxlength="10"
placeholder="过滤特殊字符长度10"
></el-input>
over
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论