3 ms·
Interesting, my memory of reading about the Svelte magic reactivity was that it was pretty well explained that the only things 'reactive' would be things which
by pcthrowaway 4y ago
Interesting, my memory of reading about the Svelte magic reactivity was that it was pretty well explained that the only things 'reactive' would be things which were assigned to in the reactive statement.
So if you want to update y on some changes to x, you do
$: y = x
And if you need something more complicated, a transformation perhaps, you put the logic in a function and assign y to the result of that
function parseX(val) { ... }
$: y = parseX(x)
- opensas 4y agotop level variables are reactive even when updated inside a function, just give it a try: https://svelte.dev/repl/44e3aece18294ddb834bcdfb4394af48?version=3.57.0 https://svelte.dev/repl/44e3aece18294ddb834bcdfb4394af48?ver... ` <script> let name = 'world'; const flip = () => name = name === name.toUpperCase() ? name.toLowerCase() : name.toUpperCase() $: console.log({ name }) </script> <h1>Hello {name}!</h1> <button on:click={flip}>flip!</button> `
- opensas 4y agothe inconsistency comes from the fact that this reactivity, triggered from inside a function, is not taken into account to build the dependency graph and ultimately decide in which order to process the statements