vue. js input box input value automatic filtering punctuation operation in special character replacement
- 2021-08-09 07:04:22
- OfStack
I won't talk too much, let's just look at the code ~
< Input v-model= "relatedWords" type= "textarea" placeholder= "Please enter" @ input= 'verifyInput (formItem. relatedWords)'/ >
verifyInput(v){
let _this=this;
let punctuation = /[`~!@#$%^&*_\-=<>?:"{}|.\/;'\\[\] · ~ ! @# $ % ... & - \-={}| ""? : "" "" ","; ' ' . , ]/im;
let arr=v.split('')
let str=''
arr.map(i=>{
if(!punctuation.test(i)){
str+=i
}
})
str=str.replace(/ ( /g,'(')
str=str.replace(/ ) /g,')')
str=str.replace(/ , /g,',')
this.$nextTick(j=>{
this.relatedWords=str
})
},
Additional knowledge: vue el-input No special characters can be entered, only digit regular verification can be entered
I won't talk too much, let's just look at the code ~
<el-input
size="small"
v-model="city"
placeholder=" Please enter a city name "
@blur="addCity(scope.$index)"
@keyup.native="btKeyUp"
@keydown.native="btKeyDown"
></el-input>
// methods Inside
// You can only enter Chinese characters, English and numbers
btKeyDown(e) {
e.target.value = e.target.value.replace(/[^\a-\z\A-\Z0-9\u4E00-\u9FA5]/g,"");
},
// Restrict the input of special characters
btKeyUp(e) {
e.target.value = e.target.value.replace(/[`~!@#$%^&*()_\-+=<>?:"{}|,.\/;'\\[\] · ~ ! @# $ % ... &* ()- \-+={}| ""? : "" "" ","; ' ' ,. , ]/g,"");
}
Events such as keyup in el-input need to be added. native otherwise the event cannot be executed normally
The following are numbers only
<el-input
size="small"
v-model="scope.row.order_number"
v-show="scope.row.isShowInp_order"
@blur="editOrder(scope.$index,scope.row)"
v-focus
@keyup.native="UpNumber"
@keydown.native="UpNumber"
class="table_input"
></el-input>
// Only numbers can be entered
UpNumber(e) {
e.target.value = e.target.value.replace(/[^\d]/g,"");
}