Задачка для отличников))) Есть вот такой вот не хитрый набор

Question

Задачка для отличников))) Есть вот такой вот не хитрый набор

компонентов. https://clck.ru/sQXrY ( ссылка на vue sfc playground)

Условие:
Если нажать на кнопку у нее анимируется background.
Если компонент обновляется ( хук onUpdate) так же у нее анимируется background

Вопрос
1) как так происходит, что обновляются дочерние компоненты у которых произведена вставка данных через slot, но не обновляются компоненты если данные прокинуты через props? Причем не понятно почему вообще они обновляются если просто меняется props у их родителя, который абсолютно ни на что не влияет…

2) почему после onUpdated 6 кнопка ( нижняя правая) теряет свой переназначенный (!) ref.value и соответсвенно перестает кликаться ?

Вот думаю это я такой счастливый что словил сразу 2 бага? Или я что-то упускаю..

#frontend #javascript #programming #russian #vue.js

0

28.07.2022

3 ответов

10 просмотров

Anton. Автор вопроса

Artyom Tuchkov
1. потому что слот - функция, которую нужно вызыва...

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

0

28.07.2022

Artyom Tuchkov

Anton.
Так вопрос остается открытым.. пропс я прикидываю ...

>пропс я прикидываю динамический если ты его считаешь динамическим только из-за того, что там стоит двоеточие, то нет, пропс здесь статичный, потому что: а) это даже не реактивная переменная, соответственно, это константа, которая никак не трекается реактивной системой вью б) сам пропс - это строка, поэтому легко можно определить, изменился он или нет (а в твоем случае он никак не меняется) вывод: компонент не ререндерится >почему у кнопок должен вызываться updated потому что ты передаешь в эти кнопки слот, который является функцией, который вью вызывает каждый раз, чтобы получить актуальные данные из слота соответственно, происходит ререндер кнопок, которым в слот прилетает актуальный контент, который вернула функция слота вывод: компонент кнопки ререндерится, вызывается updated хук

0

28.07.2022

Artyom Tuchkov · Accepted Answer

1. потому что слот - функция, которую нужно вызывать каждый раз, чтобы узнать, что она вернет, а твой статичный пропс - это просто текст, который никак не поменялся, поэтому компонент не ререндерится 2. потому что ты написал в onMounted подмену значения рефа, но она срабатывает только 1 раз, когда компонент маунтится, а при следующей перезаписи рефа (когда компонент обновится) в myButton.value уже будет не рутовая нода компонента, а сам компонент, т.к. твой onMounted уже не отработал

169 похожих чатов

Задачка для отличников))) Есть вот такой вот не хитрый набор

3 ответов

Похожие вопросы