Question

以下是我的代码。我想在提交期间验证表单。一世阻止提交操作，直到所有数据都有效。因此我用过＆＃34; validata all（）＆＃34;方法。如果表单具有空/无效日期，则应该提醒＆＃34;未提交＆＃34;。否则应提醒＆＃34;已提交＆＃34;。我的问题是当我第一次点击提交按钮时，警报显示为＆＃34;已提交＆＃34;而不是＆＃34;未提交＆＃34; Result1。但当我第二次点击相同的按钮或进一步正确显示为＆＃34;未提交＆＃34; Result2。我不知道原因，为什么它不能在第一时间工作。

<template>
           <div id="app">
            <h1>Add Items</h1>
            Product Name : 
            <input type="text" name="product" v-validate="'required|alpha_dash'" >
            <span style="color:red;">{{errors.first('product')}}</span>
            <br>
            Product Price : 
            <input type="number" name="price" v-validate="'required|min_value:100|max_value:500'">
            <span style="color:red;">{{errors.first('price')}}</span>
            <br>
            <button @click="submit">Save</button>
          </div>
        </template>

          <script>
          import Vue from 'vue'
          import VeeValidate from 'vee-validate'
          Vue.use(VeeValidate)

        export default {
          name: 'addEmpl',
          methods: {
           submit() {
              this.$validator.validateAll()
              if (!this.errors.any()) {
                alert('submitted')
              }else{
                 alert('not submitted')
              }
           }
          }
        }
          </script>

Answer 1

在.. raw:: html :file: images/image.svg方法后尝试.then(...)：

validateAll()

此外，案件类似here on Github page也存在问题。你可以看看。

Javascript函数在vuejs中无法正常工作

1 个答案: