Vue手机号正则匹配姓名加密展示功能的实现

 更新时间:2022年08月22日 11:03:06   作者:HqL丶1024  
这篇文章主要介绍了Vue手机号正则匹配,姓名加密展示,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

一丶手机号

(1)正则匹配

if (!/^1[3|4|5|6|7|8|9]\d{9}$/.test(13807999985)) {
    console.log(resultPhone);//138****9985

(2)substr截取

    var phone = "17610603529";
    var mphone = phone.substr(0, 3) + "****" + phone.substr(7);
    // 如果用 Es6 模板字符串的话,可以不用+号做拼接
    var phone = "17610603529";
    var mphone = `${phone.substr(0, 3)}****${phone.substr(7)}`;
    console.log(mphone);

二丶姓名

(1)substr 截取

activated() {
    console.log(this.formatName("王八肚")); // 王**
  },
  methods: {
    formatName(name) {
      let newStr;
      if (name.length === 2) {
        newStr = name.substr(0, 1) + "*"; // 通过substr截取字符串从第0位开始截取,截取1个
      } else if (name.length > 2) {
        // 当名字大于2位时
        let char = "";
        for (let i = 0, len = name.length - 2; i < len; i++) {
          // 循环遍历字符串
          char += "*";
        }
        newStr = name.substr(0, 1) + char + name.substr(-1, 1);
      } else {
        newStr = name;
      }
      return newStr;
    },
  },

到此这篇关于Vue手机号正则匹配姓名加密展示功能的实现的文章就介绍到这了,更多相关Vue手机号正则匹配内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • Vue项目中使用Vux的安装过程

    Vue项目中使用Vux的安装过程

    这篇文章主要介绍了Vue项目中使用Vux的安装过程,非常不错,具有参考借鉴价值,需要的朋友可以参考下
    2018-05-05
  • 详细聊聊Vue中的MVVM模式原理

    详细聊聊Vue中的MVVM模式原理

    MVVM旨在利用WPF中的数据绑定函数,通过从视图层中几乎删除所有GUI代码(代码隐藏),更好地促进视图层开发与模式其余部分的分离,这篇文章主要给大家介绍了关于Vue.js中MVVM的相关资料,需要的朋友可以参考下
    2023-03-03
  • Vue动画之第三方类库实现动画方式

    Vue动画之第三方类库实现动画方式

    这篇文章主要介绍了Vue动画之第三方类库实现动画方式,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2023-04-04
  • vue.js整合vux中的上拉加载下拉刷新实例教程

    vue.js整合vux中的上拉加载下拉刷新实例教程

    这篇文章主要给大家介绍了关于vue.js整合vux中上拉加载下拉刷新的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧。
    2018-01-01
  • 使用vue重构资讯页面的实例代码解析

    使用vue重构资讯页面的实例代码解析

    这篇文章主要介绍了使用vue重构资讯页面的实例代码解析,本文通过实例代码给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下
    2019-11-11
  • vue组件与复用详解

    vue组件与复用详解

    组件 (Component) 是 Vue.js 最强大的功能之一。组件可以扩展 HTML 元素,封装可重用的代码。这篇文章主要介绍了vue组件与复用,需要的朋友可以参考下
    2018-04-04
  • Vue.js路由实现选项卡简单实例

    Vue.js路由实现选项卡简单实例

    这篇文章主要为大家详细介绍了Vue.js路由实现选项卡简单实例,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2019-07-07
  • 详解Vue整合axios的实例代码

    详解Vue整合axios的实例代码

    本篇文章主要介绍了详解Vue整合axios的实例代码,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-06-06
  • vue项目中访问本地json数据

    vue项目中访问本地json数据

    这篇文章主要介绍了vue项目中访问本地json数据方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2024-07-07
  • vue 1.x 交互实现仿百度下拉列表示例

    vue 1.x 交互实现仿百度下拉列表示例

    本篇文章主要介绍了vue 1.x 交互实现仿百度下拉列表示例,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-10-10

最新评论