目录
3.需要将用户姓名进行脱敏处理,比如:张三处理成张*,李三思处理成李 * 思,王二麻子处理成:王* * 子
1.直接在插值表达式中操作数据:
示例代码如下(身份证号脱敏):
<div>
{{ IdentityID.replace(/^(.{3})(?:\d+)(.{4})$/, "$1******$2") }}
示例代码如下(手机号脱敏):
<div>
{{ phone.replace(/^(.{3})(?:\d+)(.{4})$/, "$1****$2") }}
</div>
示例代码如下(姓名脱敏):
超过两个字的正则:
<div>
{{ name.replace(/(?<=[\u4e00-\u9fa5]).*(?=[\u4e00-\u9fa5])/, "*") }}
</div>
js测试代码:(具体替换成几个*号需要自己计算)
两个字姓名的正则:
<div>
{{ name.replace(/.*(?=[\u4e00-\u9fa5])/, "*") }}
</div>
js示例:
var phone ="13623021456";
var idcode ="440582199612056666";
var name ="陈妹";
var name1 ="陈美美";
var name2 ="欧阳美美";
phone =phone.replace(/^(.{3}).+(.{4})$/,"$1****$2");
idcode =idcode.replace(/^(.{4}).+(.{4})$/,"$1****$2");
name = name.replace(/^(.).+$/,"$1*");
name1 = name1.replace(/^(.).+(.)$/,"$1*$2");
name2 = name2.replace(/^(.{2}).+(.)/,"$1**$2");
console.log("phone",phone);
console.log("idcode",idcode);
console.log("name",name);
console.log("name1",name1);
console.log("name2",name2);
运行效果:
2.几种常见的脱敏方式:
slice()
let enStr = str.replace(/(\d{3})\d*(\d{4})/,"$1****$2");
substring()
let str = '18888888888'
let enStr = str.substring(0,3) + '' + str.substring(str.length - 4)
console.log(enStr) // 188****8888
正则
let str = '18888888888'
// 第一种
let enStr = str.replace(/(\d{3})\d*(\d{4})/,"$1****$2");
// 第二种
let enStr = str.replace(/^(.{8})(?:\d+)(.{4})$/, "$1******$2");
console.log(enStr) // 188****8888
3.需要将用户姓名进行脱敏处理,比如:张三处理成张*,李三思处理成李 * 思,王二麻子处理成:王* * 子
html :
<div class="headerLeft">{{show==true?userName:name}} <span class="headerRight" @click="changName">{{show==true?'显示':'隐藏'}}</span></div>
js:
data(){
return{
show:true,
userName:'',
name:'张三'
}
},
mounted(){
this.getName()
}
methods:{
getName(){
if(this.name.length==2){
this.userName=this.name.substring(0,1)+'' //截取name 字符串截取第一个字符,
}else if(this.name.length==3){
this.userName=this.name.substring(0,1)+""+this.name.substring(2,3)//截取第一个和第三个字符
}else if(this.name.length>3){
this.userName=this.name.substring(0,1)+""+''+this.name.substring(3,this.name.length)//截取第一个和大于第4个字符
}
},
changName(){//切换显示用户的姓名
this.showText=!this.showText
}
}