Vue.js

Question

我有两个输入字段：url 和 email

我正在使用 Vuelidate，我想制作一个自定义验证器，用于检查 url 域名是否等于电子邮件域名。

有效示例：

url: (https://)www.mydomain.example

电子邮件：johndoe@mydomain.example

无效示例：

url: (https://)www.mydomain.example

电子邮件：johndoe@somedomaine.example

验证对象：

validations: {
    form: {
      url: { required, url, maxLength: maxLength(2083) },
      email: { required, email, maxLength: maxLength(255) },
      lastName: { required, maxLength: maxLength(100) },
      firstName: { required, maxLength: maxLength(100) }
    }
  },

Answer 1

您可以使用名为 matchUrl 的 custom validator，如下所示：

  const matchUrl=(value, vm) => 
   value.substring(value.indexOf("@")+1) ===vm.url.substring(vm.url.indexOf(".")+1);

并将其用作：

validations: {
 form: {
  url: { required, url, maxLength: maxLength(2083) },
  email: { required,matchUrl, email, maxLength: maxLength(255) },
  lastName: { required, maxLength: maxLength(100) },
   firstName: { required, maxLength: maxLength(100) }
 }
},

检查this工作示例

Vue.js - 使用 Vuelidate url 域应该匹配电子邮件域

Vue.js - using Vuelidate url domain should match email domain

validation

vue-component

vuejs2

vuelidate