You can change watched value in $watch if you know what you're doing :)

[ADTC]

The $watch functionality is quite similar to useEffect in React so I'm able to apply similar principles.

One thing the docs note is this stern warning:

⚠️ Changing a property of a "watched" object as a side effect of the $watch callback will generate an infinite loop and eventually error.

I'm supposing this applies to watching simple values as well, as changing them seems to trigger the callback again.

However, in certain situations, this could actually turn out to be useful.

Alpine.data('someData', () => ({
  // ...
  init() {
    this.$watch('$store.something', value => {
      if (!value) return

      // else do something with value
      if (error) this.$store.something = ''
    })
  },
}))

In this case, if there's some error state, the watched value is "reset" and the effect is cancelled (when run again) on the empty value. This would not cause an infinite loop, but it is a clever trick to respond only to non-empty values.

---

Sidenote: We should probably mention in docs that the first argument of $watch should be a string referencing the property, not the property itself. That was a gotcha for me.

[ekwoka]

$effect would be more like an effect to respond to all dependencies, and it has built in prevention of simple endless loops.