да и вообще какой смысл в обьекте ошибок проверять булево, если этот обьект 100% содержит ошибки
от реализации его зависит, может у него ключ есть, а value равен undefined
🐏 Alexander
🐏 Alexander
пускай сначала напишет реализацию в общем
Nikita
судя по всему идея в том, чтоб наполнять обьект/массив ошибками, а потом выводить их всех сразу под формой, но нужные поля подсвечивать красным, если в обьекте/массиве ошибок есть нужные ошибки.
Andy
именно так!
Nikita
я когда только начал работать с формами и вообще начал работать с vue, заморочился так, что сделал функцию в которую я прокидывал мапу в которой содержалось названия поля и название ошибки, типо
{ nameField: 'errors.fields.nameField' } // как-то так, прокидывал в эту функцию ответ сервера и эту мапу и потом функция сама находила нужное поле и подсвечивало с помощью нативной валидации setCustomValidate()
Nikita
и типо еще можно было кинуть 3 обьект с переводами ошибок, чтоб сделать ошибки более человекопонятными
Nikita
больше я такой херней не страдаю.
Andy
кажись понял
Andy
.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]);
}
});
Andy
в консоль попадает array с ключами, а вот дальше this.errors заполняется уже без ключей
🐏 Alexander
😕
Nikita
что-то я не этого от тебя ожидал, я думал, ты уже все написал
Nikita
array с ключами это уже мапа/обьект
🐏 Alexander
Andy
ребята, я с vue третий день(
Nikita
ну что поделать, не путай хотя бы названия
Nikita
{ key: value } // object, [val, val] // array
Andy
кажется сделал какой-то дебилизм реально( но работает.... вообщем, в 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')">
Anonymous
Бадибэг
Andy
Oleksandr
Здравствуйте, хочу сделать проект на Vue + Laravel.
Лару уже знаю, как посоветуете учить Vue? Ресурсы может какие, или же обычная дока?
Andy
@eddimensi @agontarev спасибо вам)
Andy
Здравствуйте, хочу сделать проект на Vue + Laravel.
Лару уже знаю, как посоветуете учить Vue? Ресурсы может какие, или же обычная дока?
привет, сэйм стори) тоже с лары и вот третий день копаю vue. пока что оф документацию смотрю + на medium.com много чего есть
🐏 Alexander
Здравствуйте, хочу сделать проект на Vue + Laravel.
Лару уже знаю, как посоветуете учить Vue? Ресурсы может какие, или же обычная дока?
вот как раз недавно выходили видосы от Ильи Климова, можешь глянуть
🐏 Alexander
https://www.youtube.com/watch?v=ZEYFrY5ztnE
Vladislav
Andy
просто отображает список ошибок
Nikita
Почему ты свои ошибки тупо не запишешь в объект?
Nikita
V-for если что и по объекту пройти может.
Nikita
В пхп ассоциативный массив это объект в js
Andy
у меня php отдает json
Andy
ну вот при валидации 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] }
}
}
Korg
Привет всем, парни, помоги разобраться, а то я завис что-то
не перерендеривается сомпонент,
дата у меня меняется http://joxi.ru/V2VvoyDhxQzl42
а в шаблоне http://joxi.ru/krDkoVLTEloV7A изменения происходят только после первого set'a в дату, уже второе изменение даты в шаблоне не отображается
В чём может быть причина?
данные меняю this.$set
Nikita
ну вот при валидации 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] }
}
}
Я за реализацию на пхп ничего не говорю, я говорю, что твоя реализация с ошибками херь. Ты можешь вместо массива использовать объект, но ты меня в упор игноришь
Andy
Я за реализацию на пхп ничего не говорю, я говорю, что твоя реализация с ошибками херь. Ты можешь вместо массива использовать объект, но ты меня в упор игноришь
у меня не получилось, если бы умел, то использовал бы
Nikita
Что именно у тебя не получилось?
🐏 Alexander
все это можно написать гораздо меньшим количеством кода
🐏 Alexander
90% кода не нужно вообще
Nikita
все это можно написать гораздо меньшим количеством кода
Покажи ему, а то я на телефоне, а у меня бомбит от этого говнокода
🐏 Alexander
Покажи ему, а то я на телефоне, а у меня бомбит от этого говнокода
неее, сории, я НЕ хочу вообще в это залезать :D
🐏 Alexander
@mercuryskies давай разберайся и пиши нормально
Nikita
неее, сории, я НЕ хочу вообще в это залезать :D
Лан, я с самого начала на тебя не рассчитывал
Andy
блин ну вот что плохого?) https://paste.ofcode.org/WVpSdnfECymiEZUSjte8Ld
Andy
пожалуйста, не баньте)
🐏 Alexander
1) чтобы перебрать ошибки, тебе не надо использовать массив, можешь использовать тот объект который тебе приходит с АПИ
🐏 Alexander
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>
🐏 Alexander
я предполагаю примерно так должно заработать
🐏 Alexander
два for, потому что мы перебираться объект с массивом ошибок, а потом сам массив ошибок
🐏 Alexander
https://codesandbox.io/s/1o90oz4r97
Nikita
блин ну вот что плохого?) https://paste.ofcode.org/WVpSdnfECymiEZUSjte8Ld
1. Ты собираешь ошибки через вложенных if, тебе должны были по рукам бить еще в пхп за такое.
2. Мы можешь сделать this.errors обьектом, в него через цикл заполнять данными.
3. Вообще не понятно, зачем ты делаешь копирование обьекта и никак это не используешь.
Andy
тысяча сайтов на modx и jquery и все знания досвидания. почти с нуля начинаю с laravel & vue)
Nikita
4. Ты дублируешь код и вообще this.errors используешь тупо как счетчик...
Nikita
еще твой код стайл, походу это отвратительная хрень из пхп к тебе пришла
Demetrio
тысяча сайтов на modx и jquery и все знания досвидания. почти с нуля начинаю с laravel & vue)
тут такие раз в месяц - это норма)
Andy
это то все понятно, перебор всех ошибок можно по-разному сделать. вопрос то был изначально в подсветке каждого инпута поотдельности
🐏 Alexander
@mercuryskies посмотри последнюю ссылку которую я скинул, там рабочий цикл
Stanislav
В чем проблема?
Someone
Коллеги, есть приложуха на Vue+Vuex+Vue-material. Она рендерит список. У каждого элемента списка есть кнопка, она должна открывать диалог, одинаковый для всех элементов списка (сейчас состояние диалога "открыт-закрыт" хранится в Vuex и это правильно). В диалоге выбирается дата. После выбора даты диалог должен закрыться, а тот экземпляр компонента, который вызвал открытие диалога, должен узнать о том, что выбор даты сделан. Вариантов вагон, но мне в голову лезут какие-то кривые пути, как это сделать идеологически правильно?
Andy
@mercuryskies посмотри последнюю ссылку которую я скинул, там рабочий цикл
но часть отвечающая за :class="hasError('title')" более или менее норм?
Stanislav
Наверное, неожиданный вопрос :)
🐏 Alexander
Коллеги, есть приложуха на Vue+Vuex+Vue-material. Она рендерит список. У каждого элемента списка есть кнопка, она должна открывать диалог, одинаковый для всех элементов списка (сейчас состояние диалога "открыт-закрыт" хранится в Vuex и это правильно). В диалоге выбирается дата. После выбора даты диалог должен закрыться, а тот экземпляр компонента, который вызвал открытие диалога, должен узнать о том, что выбор даты сделан. Вариантов вагон, но мне в голову лезут какие-то кривые пути, как это сделать идеологически правильно?
вуикс нужен только для общих вещей, если можно сделать без него, то лучше так
Someone
А зачем тут Vuex?
Он не конкретно тут, я описываю один из кусков, оно на самом деле большое и страшное, и Vuex там точно нужен
Andy
@mercuryskies посмотри последнюю ссылку которую я скинул, там рабочий цикл
просто я тот код с урока выдернул и не вникнув из него попытался что-то рабочее сделать. придется под себя переписать всё
🐏 Alexander
Nikita
@mercuryskies https://paste.ofcode.org/QtaXEY6JwdGLEf64MTKqYs
Nikita
я тебе так предлагал
🐏 Alexander
но часть отвечающая за :class="hasError('title')" более или менее норм?
https://codesandbox.io/s/1o90oz4r97
обновил ссылку
🐏 Alexander
но часть отвечающая за :class="hasError('title')" более или менее норм?
да и вообще применяй именование правильно, если это глагол has, то это должна быть функция которая вернет булевое значение, если ты хочешь, чтобы функция вернула объект, то это уже что-то типа getClasses должно быть, с глаголом get
Andy
@agontarev @eddimensi теперь вот так) https://paste.ofcode.org/eQVMARkp9aVyQw9hynwTyJ
Andy
только из-за this.errors = null; в create чутка прыгает все
Nikita
Я предпочитаю таким образом обновлять, ты можешь просто = {}
Stanislav
@agontarev @eddimensi теперь вот так) https://paste.ofcode.org/eQVMARkp9aVyQw9hynwTyJ
А почему this.loading = false в mounted, когда запрос в created?
Andy
а это отголоски другого компонента, не принимайте во внимание