vue电话号码，姓名，身份证号快速部分隐藏（vue全局过滤器）

过滤器）"/>

vue电话号码，姓名，身份证号快速部分隐藏（vue全局过滤器）

vue电话号码，姓名，身份证号快速格式化隐藏

• vue项目中你还在调用方法将15711112222=>157****2222吗？

• vue过滤器将极大简化这个过程。

• 先看看最后的使用效果

 {{15711112222 | phone}}

只需要在html页面里这样表示，效果图

先创建一个pipe.js，我将其称之为管道

const Vue = require('vue');/*** 匹配电话号码* 15012341234 => 150****1234*/
Vue.filter('phone', function (value) {if (!value) return '';let str = value;str = str.toString().replace(/^(\d{3})(\d{4})(\d{4})/g , '$1****$3')return str;
})/*** 匹配名字* 王仙女 => 王*女*/Vue.filter('name', function (value) {if (!value) return '';let str = value;str = str.toString().replace(/^([^\x00-\xff])([^\x00-\xff]{0,})([^\x00-\xff])/g , '$1*$3')return str;
})
export default {init () {console.log('*** filter installed ***')}
}

• 在将其放到全局里引入 main.js

vue.use(pipe)