Может ли свойство данных модели 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