Vee-validate 使用第 3 方库扩展验证

Question

我尝试使用 vee-validate and awesome-phonenumber 验证 phone 数字字段，但即使我输入了正确的值，验证错误仍然出现。也确实从控制台检查了值，但仍然抛出错误消息。

import { extend } from 'vee-validate'
import PhoneNumber from 'awesome-phonenumber'

extend('phone_number', {
  message () {
    return  'This field is not a valid phone number'
  },
  validate (value) {
    let phone = new PhoneNumber(value)
    if(phone.isValid() && phone.getRegionCode() === 'AU') {
      console.log(phone.getRegionCode()) // this is true but error message still showing
    } else {
      console.log('not valid')
    }
  }
})

Answer 1

您需要 return true 在您的 vee-validate 规则中，我没有看到您 returning 任何意味着 undefined 和 vee-validate 对待undefined 与 `false.

相同

import { extend } from 'vee-validate'
import PhoneNumber from 'awesome-phonenumber'

extend('phone_number', {
  message () {
    return  'This field is not a valid phone number'
  },
  validate (value) {
    let phone = new PhoneNumber(value)
    if(phone.isValid() && phone.getRegionCode() === 'AU') {
      return true;
    }

    return false;
  }
})

Vee-validate 使用第 3 方库扩展验证

Vee-validate extend validation with 3rd party library

vee-validate