Vue 属性 v-validate 中的正则表达式答案

【问题标题】：Regex in Vue attribute v-validateVue 属性 v-validate 中的正则表达式
【发布时间】：2019-07-20 00:38:09
【问题描述】：

我想在名称字段中允许使用破折号/连字符

<input v-model="$parent.teacher.firstName" v-validate="'required|alpha|min:2'"
                           placeholder="Eva" class="bw" type="text" name="firstname"
                           autocomplete="teacher-firstname"/>

我该如何完成它？我试图添加一个正则表达式，例如'^[a-z]+(-[a-z]+)*$' 在 v-validate 但没有任何反应

【问题讨论】：

然后将alpha替换为alpha_dash。

标签： regex validation vue.js vee-validate

【解决方案1】：

你可以create a custom rule

类似这样的：

import { Validator } from 'vee-validate';

Validator.extend('name', {
  getMessage: field => 'The ' + field + ' value is not a valid name.',
  validate: value => value.test(/^[a-z]+(-[a-z]+)*$/)
});

【讨论】：

【解决方案2】：

您可以考虑将alpha 更改为alpha_dash。

您可以使用v-validate="{ required: true, regex: /^[a-z]+(?:-[a-z]+)*$/i, min: 2 }" 设置自定义正则表达式：

<input v-model="$parent.teacher.firstName"
  v-validate="{ required: true, regex: /^[a-z]+(?:-[a-z]+)*$/i, min: 2 }" 
  placeholder="Eva" class="bw" type="text" name="firstname" autocomplete="teacher-firstname">

请参阅relevant documentation。

【讨论】：