In svelte, how to `console.log('yes')` when a variable changed?

Question

let c = 0;
$: console.log(c);

If we want to print the value of c when it is changed, we can write like above.

Because c is used in $ directive literally, so this statement can be reactive to c.

But what if I just want to console.log('yes') when c is changed?

let c = 0;
$: console.log('yes');

Obviously, the statement console.log('yes') is not reactive to c.

Furthermore, if I still console.log(c) but put it into a function:

let c = 0;
function log() {
  console.log(c);
}
$: log();

log() is also not reactive to c.

So, what can I do if the reactive code doesn't literally contain the variable which I want to reactive to?

Answer 1

I asked in Twitter, the answer is:

Link to the thread: https://twitter.com/liyuanqiu/status/1149235193296773122

Answer 2

I have recently been playing with svelte and needed to call a function when a property changed.
In Vue you would do it with watch, but I could not find an equivilent in Svelte.
In my project have done it like this:

let c = 0;
$: if (c) {
    console.log("yes");
}

I am not 100% sure if this is the correct way or not though.
Hopefully Rich Harris will chime in here as I would like to know.

Answer 3

You can do it like this:

let c = 0;
$: if (c >= 0) {
    console.log("yes");
}