Функции Javascript не работают должным образом в vuejs

Ниже мой код. Я хотел бы проверить форму во время отправки. Я предотвратил действие отправки, пока все данные не будут действительны. Поэтому я использовал метод «validata all()». Если форма имеет нулевую/недействительную дату, она должна предупреждать «не отправлено». В противном случае она должна предупреждать «отправлено». Моя проблема в том, что когда я нажимал кнопку отправки в первый раз, предупреждение отображается как «отправлено» вместо «не отправлено» Результат1. Но когда я нажал ту же кнопку во второй раз или позже, она правильно отображается как «не отправлено» 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>

vue.js vuejs2 vee-validate
person Ashwini    schedule 03.05.2018    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Попробуйте метод .then(...) после validateAll():

this.$validator.validateAll().then((result) => {
  if(!result){
    alert('not submitted')
    return
  }
  alert('submitted')
}).catch(() => {
  // error check if needed
})

Кроме того, есть проблема для случая, подобного здесь, на странице Github. Вы можете посмотреть.

person vahdet    schedule 03.05.2018
comment
Да теперь нормально работает. Но в чем причина этого javascript?noredirect=1#comment87112192_50039160">ссылка . Есть ли какое-нибудь решение для этого?? - person Ashwini; 03.05.2018
comment
Другой вопрос, подходит ли это решение; просто отметьте его, чтобы иметь «чувство закрытой проблемы». Я лично тоже рассмотрю этот вопрос. - person vahdet; 03.05.2018