时间戳

首页 > 解决方案 > 不止一个验证，令人困惑

javascript - 不止一个验证，令人困惑

问题描述

我目前习惯vee-validate检查我的输入，在这种情况下我需要你检查两件事，首先是已经添加的函数，值的长度应该是 der 示例length: 2，完美，但现在我需要检查输入的值不重复。

我目前将所有已报告的 ID 保存在我的后端，我需要验证此人编写的 ID 是否不!==存在，并且我的数据库中存在任何存在于数组中的 IDidPayExist

我很困惑将 v-model 或告诉vee-validateok 与这个矩阵进行比较，我感谢帮助。

JSFiddle

美好的一天，祝福所有人。

Vue.config.productionTip = false;
Vue.use(VeeValidate);

new Vue({
  el: "#app",
  data: {
  	tx: '',
    idPayExist: [01,12,55,13,20,65]
  },
  methods: {
	
  }
})
<link href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.2/css/bulma.css" rel="stylesheet"/>
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.17/dist/vue.js"></script>
</script>
<script src="https://cdn.jsdelivr.net/npm/vee-validate@latest/dist/vee-validate.js"></script>


<div id="app">
  <div class="column">
      <div class="control">
        <label class="label">ID Pay</label>
        <input class="input" v-model="tx" v-validate="'length:2'" name="atex" type="number" autocomplete="off" required />
       </div>
       <p class="help is-danger">{{ errors.first('atex') }}</p>
  </div>

</div>

标签： javascriptvue.jsvee-validate

解决方案

查看文档，您应该能够分配多个规则

<input class="input" v-model="tx" v-validate="{length: 2, included: idPayExists}">

从文档：

警告
客户端验证永远不能替代服务器端验证。确保在您的后端验证来自用户的任何输入。

所以实际上你不应该仅仅依靠它来验证你的字段，这就是为什么你将值与 v-model 绑定并不重要。即使您不使用 VeeValidate 也会检查输入的值v-model。

推荐阅读