Vue-ANTD 表單輸入中自定義校驗一些正則表達式規則

Vue-ANTD 表單輸入中自定義校驗一些正則表達式規則


寫一個示例:
表單的rules裏面添加自定義校驗的方法:

{ rules: [  {validator: this.checkPhone} ] }

在下面的method裏面添加方法:

    checkPhone (rule, value, callback) {
      const pwdRegex = new RegExp('^[1-9]\\d{0,11}$')
         if (!pwdRegex.test(value)) {
        callback(new Error('電話號碼輸入格式有誤'))
      }  
       callback()
    },

1.校驗輸入爲電話號碼(手機號碼)

^((13[0-9])|(14[5,7])|(15[^4,\\D])|(17[0,1,3,6-8])|(18[0-9])|(19[8,9])|(166))[0-9]{8}$

2.校驗輸入爲是否爲郵箱

/^\w{3,}(\.\w+)*@[A-z0-9]+(\.[A-z]{2,5}){1,2}$/

3.校驗是否全部爲數字且有一範圍:

^[1-9]\\d{0,11}$ 或者 ^[1-9]\d{0,11}$

4.校驗輸入包含數字+字母+特殊符號:

^(?=.*[0-9])(?=.*[a-zA-Z])(?=.*[^a-zA-Z0-9]).{6,20}$

5.校驗輸入包含字母加數字
其實這三者可以隨意組合的
有些兩邊要加引號,有些不加,都試試吧

'^[A-Za-z0-9]{6,6}$'

6.輸入0-10的整數,輸入1-999的整數

/^([0-9]|10)$/
/^(?!0)\d{1,3}$/

後面還會添加更多常用規則

更多規則點擊這裏

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章