Svelte ($ :) run function on variable change

Running a function when changing a variable to svelte… Also, what does a svelte expression starting with $:

Let’s break down the syntax of the colon dollar $: on the example of a calendar.

Let there be a variable selectedDate, in which the date value of any selected day will appear.

How now to make it so that when this variable changes, a function is launched that will do something with this variable?

And this is how it is done. We’ll add a dollar sign and a colon. This is the format svelte uses for reactive changes:

let selectedDate =
$: selectedDate && eventChoosePick()

That’s all it takes. Now, if the content of selectedDate changes, the eventChoosePick () function will run. You can pass the same variable to this function in order to do something with it further, for example, send it to the backend or otherwise process it.

Similar Posts

Leave a Reply