I need to do some logic on nested property change. I only found that thing to do that
$: c, console.log('updated');
This approach was suggested by official svelte
developer from this Twitter thread.But svelte stores
do not work properly with that. For instance I have following code:
<script> import { writable } from 'svelte/store'; const s = writable({ x: 1, y: 2 }); $: $s && console.log('store updated'); $: $s.x && console.log('store x updated');</script><button on:click={() => $s.y++}> Update y</button>
The $: $s.x
part will be triggered on change of $s.y
. How to avoid that??
REPL to play around.
P.S. VueJS
has the feature @Watch('s.x')
.