Skip to content

Svelte – how to make data not reactive?

I have some HTML elements that have a property color.

<label name={name} style="color: {color}"); ">{name}</label>

The value of color will change over time. And I will add more of these label elements in future, but I wish only new elements inherit the new value – effectively, I wish to disable reactivity for this variable.

Is this possible in Svelte?

Answer

Create a property labelColor and use it, then when the color property changes it wont affect labelColor.