э, легче тогда преобразовать this.errors в обьект, и создать отдельное свойство hasErrors = true

обьект заполняешь нужными ошибками с нужным ключом, а если вообще есть ошибки ставишь true у hasErrors

тогда у всей формы будет класс error и у каждой группы будет своя ошибка

либо же не использовать hasErros,а использовать Object.keys(), чтоб узнать количество ключей в обьекте

только я тебе сразу предупрежу, чтоб не потерять реактивность, сначала заполни обьект, а потом его уже присваивай в this.errors

hasErros() { return Object.values(this.errors).some(err => Boolean(err)) }

hasErros() { return Object.values(this.errors).some(err => Boolean(err)) }

этот вариант бессмыслен

он перед началом собирания ошибок очищает this.errors

он перед началом собирания ошибок очищает this.errors

если очищает да

да и вообще какой смысл в обьекте ошибок проверять булево, если этот обьект 100% содержит ошибки

да и вообще какой смысл в обьекте ошибок проверять булево, если этот обьект 100% содержит ошибки

от реализации его зависит, может у него ключ есть, а value равен undefined

пускай сначала напишет реализацию в общем

судя по всему идея в том, чтоб наполнять обьект/массив ошибками, а потом выводить их всех сразу под формой, но нужные поля подсвечивать красным, если в обьекте/массиве ошибок есть нужные ошибки.

именно так!

я когда только начал работать с формами и вообще начал работать с vue, заморочился так, что сделал функцию в которую я прокидывал мапу в которой содержалось названия поля и название ошибки, типо { nameField: 'errors.fields.nameField' } // как-то так, прокидывал в эту функцию ответ сервера и эту мапу и потом функция сама находила нужное поле и подсвечивало с помощью нативной валидации setCustomValidate()

и типо еще можно было кинуть 3 обьект с переводами ошибок, чтоб сделать ошибки более человекопонятными

больше я такой херней не страдаю.

кажись понял

.catch(error => { console.log(error.response.data); this.errors = []; if (error.response.data.errors.title) { this.errors.push(error.response.data.errors.title[0]); } if (error.response.data.errors.intro) { this.errors.push(error.response.data.errors.intro[0]); } });

в консоль попадает array с ключами, а вот дальше this.errors заполняется уже без ключей

?

что-то я не этого от тебя ожидал, я думал, ты уже все написал

array с ключами это уже мапа/обьект

ребята, я с vue третий день(

ну что поделать, не путай хотя бы названия

{ key: value } // object, [val, val] // array

кажется сделал какой-то дебилизм реально( но работает.... вообщем, в data добавил validator: '', далее в методах hasError(field) { if (this.validator.errors) { var v = this.validator.errors; JSON.parse(JSON.stringify(v)); return { error: v[field] } } }, потом в axios поменял на .catch(error => { //console.log(error.response.data); this.errors = []; if (error.response.data.errors) { if (error.response.data.errors.title) { this.errors.push(error.response.data.errors.title[0]); } if (error.response.data.errors.intro) { this.errors.push(error.response.data.errors.intro[0]); } } this.validator = error.response.data; }); ну и в самой форме каждой группе инпутов поставил это <div class="formGroup" :class="hasError('intro')">

Бадибэг

Здравствуйте, хочу сделать проект на Vue + Laravel. Лару уже знаю, как посоветуете учить Vue? Ресурсы может какие, или же обычная дока?

@eddimensi @agontarev спасибо вам)

Здравствуйте, хочу сделать проект на Vue + Laravel. Лару уже знаю, как посоветуете учить Vue? Ресурсы может какие, или же обычная дока?

привет, сэйм стори) тоже с лары и вот третий день копаю vue. пока что оф документацию смотрю + на medium.com много чего есть

@eddimensi @agontarev спасибо вам)

ой, от души ^_^

Здравствуйте, хочу сделать проект на Vue + Laravel. Лару уже знаю, как посоветуете учить Vue? Ресурсы может какие, или же обычная дока?

вот как раз недавно выходили видосы от Ильи Климова, можешь глянуть

https://www.youtube.com/watch?v=ZEYFrY5ztnE

Здравствуйте, хочу сделать проект на Vue + Laravel. Лару уже знаю, как посоветуете учить Vue? Ресурсы может какие, или же обычная дока?

laracast

кажется сделал какой-то дебилизм реально( но работает.... вообщем, в data добавил validator: '', далее в методах hasError(field) { if (this.validator.errors) { var v = this.validator.errors; JSON.parse(JSON.stringify(v)); return { error: v[field] } } }, потом в axios поменял на .catch(error => { //console.log(error.response.data); this.errors = []; if (error.response.data.errors) { if (error.response.data.errors.title) { this.errors.push(error.response.data.errors.title[0]); } if (error.response.data.errors.intro) { this.errors.push(error.response.data.errors.intro[0]); } } this.validator = error.response.data; }); ну и в самой форме каждой группе инпутов поставил это <div class="formGroup" :class="hasError('intro')">

Херь какая та, какую роль у тебя играет массив errors?

просто отображает список ошибок

Почему ты свои ошибки тупо не запишешь в объект?

V-for если что и по объекту пройти может.

В пхп ассоциативный массив это объект в js

у меня php отдает json

у меня php отдает json

К чему ты это говоришь?

ну вот при валидации php идет response()->json, axios ловит ошибки .catch(error => { ---> error.response.data.errors . вот из этого нужно было сделать вывод каждой ошибки в отдельном div + подсветить каждый ошибочный инпут = пришлось добавить hasError(field) { if (this.validator.errors) { var v = this.validator.errors; JSON.parse(JSON.stringify(v)); return { error: v[field] } } }

Привет всем, парни, помоги разобраться, а то я завис что-то не перерендеривается сомпонент, дата у меня меняется http://joxi.ru/V2VvoyDhxQzl42 а в шаблоне http://joxi.ru/krDkoVLTEloV7A изменения происходят только после первого set'a в дату, уже второе изменение даты в шаблоне не отображается В чём может быть причина? данные меняю this.$set

ну вот при валидации php идет response()->json, axios ловит ошибки .catch(error => { ---> error.response.data.errors . вот из этого нужно было сделать вывод каждой ошибки в отдельном div + подсветить каждый ошибочный инпут = пришлось добавить hasError(field) { if (this.validator.errors) { var v = this.validator.errors; JSON.parse(JSON.stringify(v)); return { error: v[field] } } }

Я за реализацию на пхп ничего не говорю, я говорю, что твоя реализация с ошибками херь. Ты можешь вместо массива использовать объект, но ты меня в упор игноришь

Я за реализацию на пхп ничего не говорю, я говорю, что твоя реализация с ошибками херь. Ты можешь вместо массива использовать объект, но ты меня в упор игноришь

у меня не получилось, если бы умел, то использовал бы

Что именно у тебя не получилось?

все это можно написать гораздо меньшим количеством кода

90% кода не нужно вообще

все это можно написать гораздо меньшим количеством кода

Покажи ему, а то я на телефоне, а у меня бомбит от этого говнокода

Покажи ему, а то я на телефоне, а у меня бомбит от этого говнокода

неее, сории, я НЕ хочу вообще в это залезать :D

@mercuryskies давай разберайся и пиши нормально

неее, сории, я НЕ хочу вообще в это залезать :D

Лан, я с самого начала на тебя не рассчитывал

Лан, я с самого начала на тебя не рассчитывал

??

блин ну вот что плохого?) https://paste.ofcode.org/WVpSdnfECymiEZUSjte8Ld

пожалуйста, не баньте)

1) чтобы перебрать ошибки, тебе не надо использовать массив, можешь использовать тот объект который тебе приходит с АПИ

this.errors = error.response.data.errors <li v-for="error in errors">{{ error }}</li> тогда это можно будет заменить на <template v-for="errorsField in errors"> <li v-for="error in errorsField">{{ error }}</li> </template>

я предполагаю примерно так должно заработать

два for, потому что мы перебираться объект с массивом ошибок, а потом сам массив ошибок

https://codesandbox.io/s/1o90oz4r97

блин ну вот что плохого?) https://paste.ofcode.org/WVpSdnfECymiEZUSjte8Ld

1. Ты собираешь ошибки через вложенных if, тебе должны были по рукам бить еще в пхп за такое. 2. Мы можешь сделать this.errors обьектом, в него через цикл заполнять данными. 3. Вообще не понятно, зачем ты делаешь копирование обьекта и никак это не используешь.

тысяча сайтов на modx и jquery и все знания досвидания. почти с нуля начинаю с laravel & vue)

4. Ты дублируешь код и вообще this.errors используешь тупо как счетчик...

еще твой код стайл, походу это отвратительная хрень из пхп к тебе пришла

тысяча сайтов на modx и jquery и все знания досвидания. почти с нуля начинаю с laravel & vue)

тут такие раз в месяц - это норма)

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

тут такие раз в месяц - это норма)

?

@mercuryskies посмотри последнюю ссылку которую я скинул, там рабочий цикл

В чем проблема?

В чем проблема?

чувак в js слабоват

Коллеги, есть приложуха на Vue+Vuex+Vue-material. Она рендерит список. У каждого элемента списка есть кнопка, она должна открывать диалог, одинаковый для всех элементов списка (сейчас состояние диалога "открыт-закрыт" хранится в Vuex и это правильно). В диалоге выбирается дата. После выбора даты диалог должен закрыться, а тот экземпляр компонента, который вызвал открытие диалога, должен узнать о том, что выбор даты сделан. Вариантов вагон, но мне в голову лезут какие-то кривые пути, как это сделать идеологически правильно?

Коллеги, есть приложуха на Vue+Vuex+Vue-material. Она рендерит список. У каждого элемента списка есть кнопка, она должна открывать диалог, одинаковый для всех элементов списка (сейчас состояние диалога "открыт-закрыт" хранится в Vuex и это правильно). В диалоге выбирается дата. После выбора даты диалог должен закрыться, а тот экземпляр компонента, который вызвал открытие диалога, должен узнать о том, что выбор даты сделан. Вариантов вагон, но мне в голову лезут какие-то кривые пути, как это сделать идеологически правильно?

А зачем тут Vuex?

@mercuryskies посмотри последнюю ссылку которую я скинул, там рабочий цикл

но часть отвечающая за :class="hasError('title')" более или менее норм?

Наверное, неожиданный вопрос :)

Коллеги, есть приложуха на Vue+Vuex+Vue-material. Она рендерит список. У каждого элемента списка есть кнопка, она должна открывать диалог, одинаковый для всех элементов списка (сейчас состояние диалога "открыт-закрыт" хранится в Vuex и это правильно). В диалоге выбирается дата. После выбора даты диалог должен закрыться, а тот экземпляр компонента, который вызвал открытие диалога, должен узнать о том, что выбор даты сделан. Вариантов вагон, но мне в голову лезут какие-то кривые пути, как это сделать идеологически правильно?

вуикс нужен только для общих вещей, если можно сделать без него, то лучше так

А зачем тут Vuex?

Он не конкретно тут, я описываю один из кусков, оно на самом деле большое и страшное, и Vuex там точно нужен

@mercuryskies посмотри последнюю ссылку которую я скинул, там рабочий цикл

просто я тот код с урока выдернул и не вникнув из него попытался что-то рабочее сделать. придется под себя переписать всё

но часть отвечающая за :class="hasError('title')" более или менее норм?

нет не норм, ща

@mercuryskies https://paste.ofcode.org/QtaXEY6JwdGLEf64MTKqYs

я тебе так предлагал

но часть отвечающая за :class="hasError('title')" более или менее норм?

https://codesandbox.io/s/1o90oz4r97 обновил ссылку

но часть отвечающая за :class="hasError('title')" более или менее норм?

да и вообще применяй именование правильно, если это глагол has, то это должна быть функция которая вернет булевое значение, если ты хочешь, чтобы функция вернула объект, то это уже что-то типа getClasses должно быть, с глаголом get

@agontarev @eddimensi теперь вот так) https://paste.ofcode.org/eQVMARkp9aVyQw9hynwTyJ

только из-за this.errors = null; в create чутка прыгает все

Я предпочитаю таким образом обновлять, ты можешь просто = {}

@agontarev @eddimensi теперь вот так) https://paste.ofcode.org/eQVMARkp9aVyQw9hynwTyJ

А почему this.loading = false в mounted, когда запрос в created?

а это отголоски другого компонента, не принимайте во внимание

почему у тебя инпуты есть, а тега form нет, и запрос по клику, а не по сабмиту?!

т.к. присутствует еще одна форма для загрузки изображения, форму внутри формы вроде нельзя ставить

нельзя, но и писать вот такие формы тоже нельзя