Может ли свойство данных модели Vue быть равно значению, которое возвращается другим объектом свойства данных Vue?

Может ли свойство данных модели Vue быть равно значению, которое возвращается другим объектом свойства данных Vue?

В моей HTML-форме я использую компонент flatPickr (выбор календаря), который генерирует поле ввода в форме. Я пытаюсь выяснить, как динамически изменить класс поля ввода, если функция класса ошибки возвращает значение true.

Вот компонент flatPickr в html-форме, ниже которого также находится диапазон, отображающий сообщение об ошибке, возвращенное через ajax. Чего я хотел бы добиться, так это, если с сервера вернулась ошибка, я хотел бы добавить класс «is invalid» к входным данным, сгенерированным компонентом flatPickr.

 {amp}lt;flat-pickr v-model="form.captured_at" :config="config" placeholder="Select date" name="captured_at" :required="true" {amp}gt;{amp}lt;/flat-pickr{amp}gt; {amp}lt;span class="text-danger" v-if="form.errors.has('captured_at')" v-text="form.errors.get('captured_at')"{amp}gt;{amp}lt;/span{amp}gt; 

Ниже приведен фрагмент родительской модели Vue. API-интерфейс flatPickr предоставляет возможность добавить другой класс css в сгенерированное поле ввода через свойство altInputClass в объекте config .

Как мне соединить точки, где, если v-if="form.errors.has('captured_at')" возвращает true в класс config.altInputClass добавлен is-invalid класс css?

 new Vue({ el: '#app', components: {flatPickr, GopherTable}, data:{ properties: {}, newRecord: null, action: 'post', id: null, config: { altFormat: 'M j, Y', altInput: true, dateFormat: 'Ym-d', altInputClass: 'form-control', }, form: new Form({ count: '', property_id: '', captured_at: '', company_id: '' }) }, 

Я создал класс errors js, следуя инструкциям руководства Laracasts Vue2: https://laracasts.com/series/learn-vue-2-step-by-step/episodes/20

Понравилась статья? Поделиться с друзьями:
JavaScript & TypeScript
Adblock
detector