В идеале, было бы круто каким-то образом в компьютед добавить проверку, что мол если есть флаг, то не меняй себя, если нет, то меняй.

ну ты при первом вызове компьютед достаешь данные, кладешь их в локальную дату, ставишь флаг

при втором вызове смотришь что флаг выставлен и возвращаешь то что есть в локальной дате

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

При первом данных может не быть еще. Это тоже ньюанс.

В целом вроде простая задача, а реализовать как-то совсем не просто получается.

ну ты же можешь это провереть в computed

есть там данные или нет

как только данные есть то что-то делаешь

не уверен насчет правильности этого решения, но другого в голове нет, пока что

А можно вообще из компьютед обратиться к самому себе?

всмысле, к локальному компоненту?

Нет, можно ли внутри функции компьютед получить ее предыдущее значение?

Нет, можно ли внутри функции компьютед получить ее предыдущее значение?

ну ты его храни в дате компонента

@vjkosmos reselect

Обеспечит нужную функциональность

@vjkosmos reselect

Сейчас буду искать\читать что это такое. Спасибо.

Скорее всего понадобится кастомное условие для кеширования

А где можно прочитать про reselect, в API не вижу такого?

А где можно прочитать про reselect, в API не вижу такого?

это отдельная либа

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

если я правильно понял, то речь об этой https://github.com/reactjs/reselect

Не смотрите что там про реакт

Оно к реакту никак не привязано вообще

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

Объясните почему работает https://jsfiddle.net/v9xptyzw/1/ учитывая что https://ru.vuejs.org/v2/guide/list.html#Компоненты-и-v-for ? А у меня никаких :key и bind

Предварительное мое решение (пока без reselect):

computed: { wordsToDisplay() { let wordsOnDisplay = this.wordsOnDisplay; if (wordsOnDisplay.length === 0 || wordsOnDisplay.filter(word => word.use === 0).length === 0) { wordsOnDisplay = this.wordsToCheck(); } this.wordsOnDisplay = wordsOnDisplay; return wordsOnDisplay; },

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

Объясните почему работает https://jsfiddle.net/v9xptyzw/1/ учитывая что https://ru.vuejs.org/v2/guide/list.html#Компоненты-и-v-for ? А у меня никаких :key и bind

Они крайне желательны но не обязательно

Завтра буду разбираться с reselectom, так как пока все равно "костыль".

Объясните почему работает https://jsfiddle.net/v9xptyzw/1/ учитывая что https://ru.vuejs.org/v2/guide/list.html#Компоненты-и-v-for ? А у меня никаких :key и bind

Начиная с версии 2.3 (вроде) использование v-for на компонентах с key настоятельно рекомендуется

Они крайне желательны но не обязательно

Есть предположения на какие грабли потом можно нарваться?

Да, кривое обновление списков

Объясните почему работает https://jsfiddle.net/v9xptyzw/1/ учитывая что https://ru.vuejs.org/v2/guide/list.html#Компоненты-и-v-for ? А у меня никаких :key и bind

а у тебя там просто html

Не думайте, всегда используйте key

ок

а у тебя там просто html

?

?

v-for на дивах, а не на компонентах. Тут есть разница для key

v-for на дивах, а не на компонентах. Тут есть разница для key

а. все, понял

Нет, никакой

Механизм diff'а будет одинаков

Нет, никакой

по крайней мере, vue в консольке орет, когда key нет на компонентах. А когда нет на тэгах, ничего не пишет

А соответсвенно то что я буду биндить в компоненте должно быть в data родителя?

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

приветы

как вычисляемому свойству присвоить результат запроса axios?

как вычисляемому свойству присвоить результат запроса axios?

а надо ли?

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

а зачем стейт через пропс передавать?

в голос

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

а почему не через data?

@xanf_ua @c01nd01r Спаисбо. Разобрался. v-for на компоненте берет данные из родителя в который вложен, в самом компоненте получаем их через props и этот props биндим.

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

computed: { a: { get: vm => /* что-то там берем */, set (val) { /* что-то там кладем */ } } }

но здесь вообще вотчер нужен

watch: { a (val) { // запрос и кладем что-то куда-то } }

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

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

ребят, для новых приложений что лучше взять webpack и потом pwa если что сделать или сразу pwa и там как пойдёт?

ребят, для новых приложений что лучше взять webpack и потом pwa если что сделать или сразу pwa и там как пойдёт?

сравни чем отличаются :)

вопрос, возможно, глупый, но как сделать, чтобы это работало? https://jsfiddle.net/f7gpjuo0/

под "работало" я подразумеваю рендеринг двойки при клике по .child

nextTick

хотя

не сработает, наверное

я как бы понимаю, почему оно так себя ведёт, и понимаю, что так вообще делать не надо, но мне от этого не легче

я как бы понимаю, почему оно так себя ведёт, и понимаю, что так вообще делать не надо, но мне от этого не легче

https://jsfiddle.net/f7gpjuo0/2/

watch: { a (val) { // запрос и кладем что-то куда-то } }

ага, сделал через watch, спасибо

ERROR: S client not available

https://jsfiddle.net/f7gpjuo0/2/

спасибо. в данном случае клик по .parent и .child делают одно и то же, у меня кейс немного другой

если вы намекаете на изменение data через метод, то не поможет

тут вообще (я так думаю), дело в том, что оба клика отрабатывают. кликая по ребёнку, мы кликаем и по родителю. причём, клик по родителю отрабатывает в последнюю очередь

это мои догадки, но в devtools я вижу нечто подобное

меня щас посетила мысль написать метод и в нём смотреть, по какому DOM элементу был произведён клик. блин, я не хочу так жить =\

спасибо. в данном случае клик по .parent и .child делают одно и то же, у меня кейс немного другой

https://jsfiddle.net/f7gpjuo0/3/

а вот как посмотреть data-атрибут я пока не знаю )

читаете мои мысли практически)

меня щас посетила мысль написать метод и в нём смотреть, по какому DOM элементу был произведён клик. блин, я не хочу так жить =\

https://jsfiddle.net/f7gpjuo0/3/

ну или я ваши)

ваш способ даже не так плох. спасибо!

а вот как посмотреть data-атрибут я пока не знаю )

и я имел в виду свойство инстанса

на всякий случай вдруг https://jsfiddle.net/f7gpjuo0/4/

https://jsfiddle.net/f7gpjuo0/5/

Дальше, думаю, понятно :)

а вот это не в кассу, пардон)

вы ничего не изменяете в data в своём примере, а именно в этом смысл задачи

ну какая разница

вы ничего не изменяете в data в своём примере, а именно в этом смысл задачи

вызываются то нужные функции

тут вообще (я так думаю), дело в том, что оба клика отрабатывают. кликая по ребёнку, мы кликаем и по родителю. причём, клик по родителю отрабатывает в последнюю очередь

или вы об этом?

Эх... https://learn.javascript.ru/event-bubbling

ну да

@click.stop='myClick("child")'

Нашел отличный пример для разбора Firebase, может кому понадобится https://github.com/firebase/firechat

Нашел отличный пример для разбора Firebase, может кому понадобится https://github.com/firebase/firechat

?

@click.stop='myClick("child")'

ёлки палки, вот так всё просто, на самом деле

у тебя всплытием клик срабатывает на родителе. Собственно, пример с алертами это и демонстрирует. Сначала выполняется метод у чилдрена (x = 2), потом у родителя (x = 1)

да я так и думал, но про stopPropagation совсем забыл

спасибо ?

?