Vue ошибки доступа внутри вычисляется - PullRequest
Новая
       18

Vue ошибки доступа внутри вычисляется

0 голосов
/ 03 ноября 2019

Я только начинаю изучать Vue и приступаю к проверке.

Я нашел несколько старых примеров, в которых используется Vee-Validate, но, похоже, он недавно изменился, поэтому кто-нибудь может мне помочь преобразоватьэтот код для использования новой версии Vee-Validate?

Насколько я могу судить, приведенный ниже код пытается отправить на экран сообщение об ошибке, а не значение по умолчанию при возникновении ошибки.

Браузер Chrome сообщает мне, что он не может прочитать свойство 'first' из undefined, поэтому я не думаю, что могу получить доступ к ошибке, используя this.errors.

Возможно ли получить доступ кerrors внутри 'вычислено'? 

<template>
  <div>
    <ValidationProvider rules="required" v-slot="{ errors }">
      <input type="text" v-model="input" name="myfield">
      <span>{{ myError }}</span>
    </ValidationProvider>
  </div>
</template>

<script>
import { ValidationProvider } from 'vee-validate';

export default {
  components: {
    ValidationProvider
  },
  computed: {
    myError () {
      if (this.errors.first('myfield') === 'The myfield field is required.') {
        return 'My bespoke message'
      }
      return this.errors.first('myfield')
    }
  }
};
</script>

1 Ответ

0 голосов
/ 04 ноября 2019

Посмотрите на Слоты с областью действия . В двух словах, компонент ValidationProvider использует слот, который предоставляет вам объект ошибок. Вы можете думать об этом как о внутреннем объекте ValidationProvider. Однако проблема в том, что его можно использовать только внутри области слота (в пределах ValidationProvider). Ваше использование предполагает, что ошибки obj являются частью экземпляра вашего компонента (либо data, computed, method ...), что неверно. Больше чтения можно найти здесь .

...