9 - regular check set

Commonly used regular

In project development , some input（ Input ） Box needs to be verified , Whether the input content is legal ; Here are some common Regular check .

//  Regular check modularization 

export default {
    
    data() {
    
        return {
    
            rules: {
    
                /* 1, The password must be by 10 To 16 Digit number 、 Upper and lower case letters and special symbols */
                passwordReg: [
                    {
     required: true, message: ' Please input a password ', trigger: 'blur' },
                    {
     pattern: /^(?=.*[0-9].*)(?=.*[A-Z].*)(?=.*[a-z].*)(?=.*[[email protected]#$%^&*_].*).{10,16}$/, message: ' Incorrect format ' },
                ],

                /* 2, Unified social credit code */
                unifiedSocialCreditCodeReg: [
                    {
     required: true, message: ' Please enter the unified social credit code ', trigger: 'blur' },
                    {
     pattern: /^([0-9A-HJ-NPQRTUWXY]{2}\d{6}[0-9A-HJ-NPQRTUWXY]{10}|[1-9]\d{14})$/, message: ' Incorrect format ' },
                ],

                /* 3, Taxpayer identification number */
                ITINReg: [
                    {
     required: true, message: ' Please enter the unified social credit code ', trigger: 'blur' },
                    {
     pattern: /[0-9A-HJ-NPQRTUWXY]{2}\d{6}[0-9A-HJ-NPQRTUWXY]{10}/, message: ' Incorrect format ' },
                ],

                /* 4, cell-phone number */
                mobileReg: [
                    {
     required: true, message: ' Please enter your mobile number ', trigger: 'blur' },
                    {
     pattern: /^1[34578]\d{9}$/, message: ' Incorrect format ' },
                ],

                /* 5, Landline */
                specialPlaneReg: [
                    {
     required: true, message: ' Please enter the landline number ', trigger: 'blur' },
                    {
     pattern: /^(0[0-9]{2,3}\-)([2-9][0-9]{4,7})+(\-[0-9]{1,4})?$/, message: ' Incorrect format ' },
                ],

                /* 6, Illegal number */
                unallowableDigitReg: [
                    {
     required: true, message: ' Please enter a number ', trigger: 'blur' },
                    {
     pattern: /^\d+$|^\d+[.]?\d+$/, message: ' Illegal number ' },
                ],

                /* 7, It has to be numbers */
                figureReg: [
                    {
     required: true, message: ' Please enter a number ', trigger: 'blur' },
                    {
     pattern: /^[0-9][0-9]*([.][0-9]+)?$/, message: ' It has to be numbers ' },
                ],

                /* 8, Id card */
                identityCardReg: [
                    {
     required: true, message: ' Please input ID card number ', trigger: 'blur' },
                    {
     pattern: /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/, message: ' Incorrect format ' },
                ],

                /* 9, mailbox */
                mailboxReg: [
                    {
     required: true, message: ' Please enter email address ', trigger: 'blur' },
                    {
     pattern: /^([a-zA-Z0-9_-])[email protected]([a-zA-Z0-9_-])+((.[a-zA-Z0-9_-]{2,3}){1,2})$/, message: ' Incorrect format ' },
                ],

                /* 10, WeChat */
                wxReg: [
                    {
     required: true, message: ' Please input the micro signal ', trigger: 'blur' },
                    {
     pattern: /^[a-zA-Z0-9]{1}[-_a-zA-Z0-9]{4,19}$/, message: ' Incorrect format ' },
                ],

                /* 11, Integers */
                integerReg: [
                    {
     required: true, message: ' please enter an integer ', trigger: 'blur' },
                    {
     pattern: /^([0]|[1-9][0-9]*)$/, message: ' Incorrect format ' },
                ],

                /* 12, Effective amount */
                validMoneyReg: [
                    {
     required: true, message: ' Please enter a valid amount ', trigger: 'blur' },
                    {
     pattern: /^[1-9][0-9]*([.][0-9]+)?$/, message: ' Incorrect format ' },
                ],

                /* 13, Hong Kong macau pass */
                HKReg: [
                    {
     required: true, message: ' Please enter the Hong Kong and Macao pass number ', trigger: 'blur' },
                    {
     pattern: /^[CW]\d{8}$/, message: ' Incorrect format ' },
                ],

                /* 14, Taiwan pass */
                TWReg: [
                    {
     required: true, message: ' Please enter the Taiwan pass number ', trigger: 'blur' },
                    {
     pattern: /^[a-zA-Z][0-9]{9}$/, message: ' Incorrect format ' },
                ],

                /* 15, passport */
                passportReg: [
                    {
     required: true, message: ' Please enter your passport number ', trigger: 'blur' },
                    {
     pattern: /^1[45][0-9]{7}$|([P|p|S|s]\d{7}$)|([S|s|G|g]\d{8}$)|([Gg|Tt|Ss|Ll|Qq|Dd|Aa|Ff]\d{8}$)|([H|h|M|m]\d{8,10})$/, message: ' Incorrect format ' },
                ],

                /* 16, Bank card number */
                cardNoReg: [
                    {
     required: true, message: ' Please enter your bank card number ', trigger: 'blur' },
                    {
     pattern: /^([0-9]{1})(\d{9,29})$/, message: ' Incorrect format ' },
                ],

                /* 17, The input contains special symbols */
                specialCharacterReg: [
                    {
     required: true, message: ' Please enter the content ', trigger: 'blur' },
                    {
     pattern: /^([0-9]{1})(\d{9,29})$/, message: ' The input contains special symbols ' },
                ],

                /* 18, Including Chinese */
                ContainsChineseReg: [
                    {
     required: true, message: ' Please enter the content ', trigger: 'blur' },
                    {
     pattern: /[\u4E00-\u9FA5]/, message: ' The input content contains Chinese ' },
                ],

                /* 19, Zip code */
                postCodeReg: [
                    {
     required: true, message: ' Please enter the content ', trigger: 'blur' },
                    {
     pattern: /^\d{6}$/, message: ' Incorrect format ' },
                ],

                /* 20, The business license 、 Organization code */
                businessLicenseReg: [
                    {
     required: true, message: ' Please enter the content ', trigger: 'blur' },
                    {
     pattern: /^[a-zA-Z0-9]{10,20}$/, message: ' Incorrect format ' },
                ],

                /* 21, Tax registration certificate */
                taxRegistrationCertificateReg: [
                    {
     required: true, message: ' Please enter the content ', trigger: 'blur' },
                    {
     pattern: /^[0-9a-zA-z_]{10,20}$/, message: ' Incorrect format ' },
                ],

            },
        };
    },

};

Regular modularity

1. Regular in a js The document defines ;（ The above code is an example ）
2. Use... In required components mixins Mix into components ;

import rules from "@/mixins/regular-modularization.js";

export default {
    
	name: "vueRegularModularization",
  mixins: [rules],
  data() {
    
    return {
    
      ruleForm: {
    
        mobileReg: "",
      },
    };
  },
}

3. Components using regular .

<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm" >