vue自定义指令——手机掩码

phone.js

function phoneMask(mobile = '') {
  return mobile.replace(/(\d{3})\d{4}(\d{4})/gi, '$1****$2');
}

function isNumber(val) {
  return typeof val === 'number';
}

export default {
  name: 'phone',
  directive: {
    mounted(el, binding) {
      el.innerHTML =
        isNumber(binding.value) || !/\D/.test(binding.value)
          ? phoneMask(binding.value.toString())
          : binding.value;
    }
  }
};
使用  v-phone

main.js

全局注册
import phone from './phone.js';
createApp(App)
  .use(store)
  .use(router)
  .directive(phone.name, phone.directive) // 号码中间加星
  .mount('#app');