第一种方法用input组件自带的@input事件
使用@input事件 绑定变量用trim修剪掉前端和末尾的空格后用replace替换空格为空 把处理过的值赋给自己
<input type="text" class="" v-model="certNo" placeholder="请输入您的证书编号" @blur="certNo = certNo.trim().replace(/\s+/g,'')">
第二种方法用函数处理
obj: {
name: '',//姓名
cardId: ''//身份证号
},
certNo: '',//证书编号
如果您想支持类似this.trimVal(this, 'obj.name');this.trimVal('certNo')
这样只传递属性名的方式,可以对trtNo')
方法进行改进,使其可以处理不同类型的参数。
例如,可以增加一个参数context
,表示要进行字符串处理的对象(可能是组件实例或其他对象)。同时,还可以通过判断property
参数是否包含.
符号来确定是直接处理属性,还是需要拆分属性路径后再处理。
示例代码如下:
this.trimVal(this, 'obj.name');
this.trimVal(this, 'certNo');
trimVal(context, property) {
let obj, propName;
if (property.includes('.')) {
// 如果包含.符号,则说明需要处理嵌套属性
const props = property.split('.');
propName = props.pop();
obj = props.reduce((o, p) => o[p], context);
} else {
// 否则直接处理对象的属性
propName = property;
obj = context;
}
// 获取属性值
let value = obj[propName];
// 去掉空格
let newValue = value.trim().replace(' ', '');
// 赋值给属性
obj[propName] = newValue;
}
这样就可以同时支持处理嵌套属性和直接处理属性名的情况了。
标签:uniapp,obj,trimVal,处理,微信,propName,input,property,属性 From: https://blog.51cto.com/u_15694202/7715767