vue3项目中常用表单验证挂载到vue实例

// 表单验证
export default {
  install: function(Vue) {
    // 空验证
    Vue.config.globalProperties.check_null = function(txt) {
      return txt == '' ? true : /^[ ]+$/g.test(txt)
    }
    // 手机验证
    Vue.config.globalProperties.check_phone = function(txt) {
      return /^(1d{10})$/g.test(txt)
    }
    // 检测固话号码
    Vue.config.globalProperties.check_tele = function(txt) {
      return /^((0d{2,3}-d{7,8}))$/g.test(txt)
    }
    // 检测手机和固话
    Vue.config.globalProperties.check_telephone = function(txt) {
      return /^((0d{2,3}-d{7,8})|(1d{10}))$/g.test(txt)
    }
    // 邮箱验证
    Vue.config.globalProperties.check_email = function(txt) {
      return /^[w!#$%&'*+/=?^_`{|}~-]+(?:.[w!#$%&'*+/=?^_`{|}~-]+)*@(?:[w](?:[w-]*[w])?.)+[w](?:[w-]*[w])?$/g.test(
        txt
      )
    }
    // 检测身份证
    Vue.config.globalProperties.check_idcard = function(txt) {
      return /^[1-9]{1}[0-9]{14}$|^[1-9]{1}[0-9]{16}([0-9]|[xX])$/g.test(txt)
    }
    // 检测姓名
    // Vue.config.globalProperties.check_name = function(txt) {
    //   return /^[a-zA-Zu4e00-u9fa5\_-.·]*$/g.test(txt)
    // }
    // 检测姓名(中文)
    // Vue.config.globalProperties.check_cn_name = function(txt) {
    //   return /^[u4e00-u9fa5.·]*$/g.test(txt)
    // }
    // 检测姓名(英文)
    // Vue.config.globalProperties.check_en_name = function(txt) {
    //   return /^[a-zA-Z\_-.·]*$/g.test(txt)
    // }
    // 检测用户名(长度在3~16之间,只能包含英文、数字和下划线,区分大小写)
    Vue.config.globalProperties.check_username = function(txt) {
      return /^[a-zA-Z0-9_-]{3,16}$/g.test(txt)
    }
    // 密码验证(以字母开头,长度在6~18之间,只能包含字符、数字和下划线,区分大小写)
    Vue.config.globalProperties.check_password = function(txt) {
      return /^[a-zA-Z]w{5,17}$/g.test(txt)
    }
    // 检测url
    // Vue.config.globalProperties.check_url = function(txt) {
    //   return /^(https?://)?([da-z.-]+).([a-z.]{2,6})([/w .-]*)*/?$/g.test(txt)
    // }
    // 检测ip地址
    Vue.config.globalProperties.check_ip = function(txt) {
      return /^(d{1,2}|1dd|2[0-4]d|25[0-5]).(d{1,2}|1dd|2[0-4]d|25[0-5]).(d{1,2}|1dd|2[0-4]d|25[0-5]).(d{1,2}|1dd|2[0-4]d|25[0-5])$/g.test(
        txt
      )
    }
    // 金钱验证(两位小数)
    Vue.config.globalProperties.check_money = function(txt) {
      return /(^[1-9](d+)?(.d{1,2})?$)|(^(0){1}$)|(^d.d{1,2}?$)/g.test(txt)
    }
    // 整数
    Vue.config.globalProperties.check_int = function(txt) {
      return /(^[0-9]d*$)/g.test(txt)
    }
    // 正整数
    Vue.config.globalProperties.check_int2 = function(txt) {
      return /(^[1-9]d*$)/g.test(txt)
    }
    // emoji表情验证
    Vue.config.globalProperties.check_emoji = function(txt) {
      return /^([u00A9u00AEu203Cu2049u2122u2139u2194-u2199u21A9-u21AAu231A-u231Bu2328u23CFu23E9-u23F3u23F8-u23FAu24C2u25AA-u25ABu25B6u25C0u25FB-u25FEu2600-u2604u260Eu2611u2614-u2615u2618u261Du2620u2622-u2623u2626u262Au262E-u262Fu2638-u263Au2640u2642u2648-u2653u2660u2663u2665-u2666u2668u267Bu267Fu2692-u2697u2699u269B-u269Cu26A0-u26A1u26AA-u26ABu26B0-u26B1u26BD-u26BEu26C4-u26C5u26C8u26CE-u26CFu26D1u26D3-u26D4u26E9-u26EAu26F0-u26F5u26F7-u26FAu26FDu2702u2705u2708-u270Du270Fu2712u2714u2716u271Du2721u2728u2733-u2734u2744u2747u274Cu274Eu2753-u2755u2757u2763-u2764u2795-u2797u27A1u27B0u27BFu2934-u2935u2B05-u2B07u2B1B-u2B1Cu2B50u2B55u3030u303Du3297u3299]|uD83C[uDC04uDCCFuDD70-uDD71uDD7E-uDD7FuDD8EuDD91-uDD9AuDDE6-uDDFFuDE01-uDE02uDE1AuDE2FuDE32-uDE3AuDE50-uDE51uDF00-uDF21uDF24-uDF93uDF96-uDF97uDF99-uDF9BuDF9E-uDFF0uDFF3-uDFF5uDFF7-uDFFF])|(uD83D[uDC00-uDCFDuDCFF-uDD3DuDD49-uDD4EuDD50-uDD67uDD6F-uDD70uDD73-uDD7AuDD87uDD8A-uDD8DuDD90uDD95-uDD96uDDA4-uDDA5uDDA8uDDB1-uDDB2uDDBCuDDC2-uDDC4uDDD1-uDDD3uDDDC-uDDDEuDDE1uDDE3uDDE8uDDEFuDDF3uDDFA-uDE4FuDE80-uDEC5uDECB-uDED2uDEE0-uDEE5uDEE9uDEEB-uDEECuDEF0uDEF3-uDEF6])|(uD83E[uDD10-uDD1EuDD20-uDD27uDD30uDD33-uDD3AuDD3C-uDD3EuDD40-uDD45uDD47-uDD4BuDD50-uDD5EuDD80-uDD91uDDC0])$/g.test(
        txt
      )
    }
    // 隐藏手机号
    Vue.config.globalProperties.phoneChang = function(txt) {
      return txt.toString().replace(/^(d{3})(d{4})(d{4})$/, '$1****$3')
    }
    // 替换表单的前后空格
    Vue.config.globalProperties.trim = function(txt) {
      return txt.replace(/(^s*)|(s*$)/g, '')
    }
    // 身份证位数
    Vue.config.globalProperties.idcardNumTest = function(txt) {
      return txt.toString().length == 15 || txt.toString().length == 18 ? true : false
    }
    // /n替换成br
    Vue.config.globalProperties.NToBr = function(txt) {
      return txt.replace(/
/g, '<br>')
    }
// br替换成/n Vue.config.globalProperties.BrToN = function(txt) { return txt.replace(/<br>/g,
' ') } // 验证码 Vue.config.globalProperties.setTime = function(that) { if (that.phonecode.phoneFlag === 0) { // 界面倒计时 that.phonecode.time = 60 that.phonecode.phoneFlag = 1 that.phonecode.phoneText = that.phonecode.time + 's' var times = setInterval(function() { if (--that.phonecode.time !== 0) { that.phonecode.phoneText = that.phonecode.time + 's' } else { clearInterval(times) // that.time = 3 that.phonecode.phoneText = '重新发送' that.phonecode.phoneFlag = 0 } }, 1000) that.phonecode.oldPhone = that.phone // 记录现时的手机号 } } }, }

在main.js中引用即可

import formcheck from './utils/formcheck'
const app = createApp(App)
app.config.globalProperties.http = () => {
  console.log('i am http')
}
app
  .use(formcheck)
  .mount('#app')

组件内使用

const { proxy} = getCurrentInstance();
console.log(proxy.check_null("aaaaaaa"));//true
原文地址:https://www.cnblogs.com/yixiancheng/p/15011392.html