#22 Криптономикон: refs - Vue.js: практика

Материалы к видео:
Код по итогам урока: gitlab.com/vue...
- ru.vuejs.org/v...
- v3.vuejs.org/g...
Видео создано благодаря подписчикам проекта на нашем Patreon.
Поддержите нас! / javascriptninja

[@prosto_germania]

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

[@temirsultanov]

Да да, а потом ты пытаешься делать всё тоже самое, но получается костыль на костыле

[@JavaScriptNinja]

Извините за небольшую статику в этом и следующем уроке, уже исправлено
Следующее видео 18.03.2021 в 12:00

[@mykola.artemov]

* давайте дождёмся чтобы не ждать 7:45. =)

[@mykola.artemov]

самые милые видео-уроки на всём ютубе )))

[@JavaScriptNinja]

@@mykola.artemov просто Ася моя жизнь в одной цитате :)

[@anduinwrynn5647]

Илья, большое спасибо за ваш труд!
Заметил что в этом уроке была проблема с единственным элементом в массиве graph при загрузке страницы, потому что метод пересчета вызывается на событии "resize".
Подумал сначала что я где-то у себя в коде завтыкал, но нет, склонил ваш репозиторий, перешел в ветку урока, и действительно баг присутствует.
После того как заглянул в следующий урок, приятно осознавать себя хорошим студентом)
В программировании любознательность пожалуй одна из самых важных составляющих.

[@devixrootix9115]

7:43 "Давайте дождёмся, чтобы не ждать" 👀

[@alexanonymous5823]

спасибо огромное за курс!!! невероятно полезная инфа=)) огромное спасибо еще раз

[@Epic0n]

Я бы для эстатов еще добавил поведение что когда прошло достаточно времени то при расширении графика чтобы он заполнялся значениями которые исчезли до этого. Чтобы график всегда был полон за исключением начала его работы :)

[@user-san-chous]

так добавь, интересно будет посмотерть решение)

[@htol78]

Спасибо за курс! Если не сложно, делай пожалуйста шрифт в vscode побольше.

[@Antonio-fm1sq]

Супер материал, спасибо

[@andreyligiza9479]

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

[@barrettM8]

Спасибо 👍

[@Qu1ckman]

Можно было просто держать к примеру не более 100 итемов в масиве и задать итемам фикс ширину, на родителя повесить overflow: hidden display: flex, flex-direction: row-reverse и график уходил бы за контейнер и с ресайзом бы не было проблем никаких, я думаю это было бы даже более производительно, поправьте если ошибаюсь

[@temirsultanov]

А как в начале полоски будут идти вправо?

[@pilyugin]

Я думал не плохо знаю основы vue, но чем больше с ним общаюсь - тем больше удивительного узнаю))
Считал что рефы нужны в основном чтобы дернуть метод в дочернем компоненте или получить его свойство, оказывается они работают с любыми дом узлами...
Считал что template можно задавать только в самом свойстве, но недавно узнал, что можно определить в теле документа и просто указать id...
Видимо связано с тем, что я не поняв компонентов перескочил на однофайловые и они мне дико понравились, что даже не возвращался к обычным))) но на работе vue только точечно используем и однофайловые компоненты там не нужны)

[@ayub-a]

17:30
Понимаю что ролик 2-х летней давности. Было интересно проверить. Сейчас(18.08.2023) ref в обоих версиях,
а точнее Vue 2.5.22 и Vue 3.2.13 - оба возвращают массивы со всеми элементами в цикле v-for. Наверное тогда так и было.
А ролик топ)

[@JavaScriptNinja]

Угу, исправили в 3.2

[@sovaz1997]

С shift/unshift - жиза))

[@xman5911]

Илья, 2 года назад не было Composition Api(script setup)?

[@dravendominos273]

14:05
на самом деле, в повседневности так редко используешь while, что это может показаться умным решением, а сначала задуматься про slice/splice

[@dravendominos273]

@Данил Мальков неужели там часто используют while?

[@yehudavolodin1183]

Для доступа к информации об узле правильно использовать refs и неправильно использовать id?

[@JavaScriptNinja]

Да

[@dmytroputrin980]

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

[@PowWowVideo]

А реф - может быть функцией, как в реакт? чтобы обращатся к div и каждый раз э актуальную ширину, без всяких listener'ов

[@JavaScriptNinja]

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

[@Dostoevsky2012]

наверное лучше использовать splice

[@alcotrener]

Только у меня во Vue3 ref c v-for делает массив как и во Vue2?

[@JavaScriptNinja]

это исправили во вью 3.2

[@alcotrener]

@@JavaScriptNinja спасибо

[@alcotrener]

@@JavaScriptNinja если можно, есть ещё один вопрос по дз: если на диве со столбиком графика указать ref, и делить на его ширину значение ширины всего дива с графиком, то вопрос с фиксацией ширины каждого столба не решается. Получается что ref каким-то образом стал реактивным?
Заранее прошу прощения если я пишу дикий кринж

[@slaty331]

пошел загуглил "захардкодить" 😅

[@ГенаПетров-н5ы]

На телефоне мелкий шрифт в VSCode