Svelte уведомление об обновленной привязке

Есть ли способ узнать, какая привязка обновляется в Svelte? У меня есть список элементов, привязанных к массиву значений, и я хотел бы визуально отмечать обновленные значения при изменении базового массива.


svelte svelte-3
person Tomasz Plonka    schedule 25.09.2020    source источник
comment
Приведите пример того, о чем вы говорите и чего вам нужно достичь.   -  person johannchopin    schedule 25.09.2020
comment
Я хотел бы применить класс к узлу при изменении связанной переменной. В основном, как интерфейс INotifyPropertyChanged в мире WPF.   -  person Tomasz Plonka    schedule 25.09.2020

Ответы (2)


arrow_upward
1
arrow_downward

Вы можете определить свой класс следующим образом:

<style>
:global(.myclass){
  background-color:pink;
}
</style>

Тогда svelte не будет добавлять случайную строку в ваши имена классов (см. Мой комментарий в другом ответе), и вы можете добавить класс в узел своей функции.
Вот REPL: https://svelte.dev/repl/01b8ed826cb64c119567060a64014925?version=3.28.0

person grohjy    schedule 25.09.2020
comment
Спасибо, это помогло, посмотрите мой обновленный REPL, чтобы увидеть красиво анимированное уведомление. - person Tomasz Plonka; 26.09.2020

arrow_upward
0
arrow_downward

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

node.className="..."

Но это как-то не действует.

https://svelte.dev/repl/d0b90cca3c904a7c8af9 >

person Tomasz Plonka    schedule 25.09.2020
comment
Svelte добавляет случайную строку к каждому классу, чтобы изолировать стили от других компонентов или элементов dom. Вы можете увидеть добавленную строку, если используете инструменты разработчика или в REPL откройте вкладку под названием «Вывод CSS». Поэтому, если вы попытаетесь добавить className, например, myclass, этого будет недостаточно, потому что svelte изменил ваш стиль .myclass.svelte-vz17d{...} - person grohjy; 25.09.2020