The (missing) watch for @vue/reactivity. Works without Vue.

want to know how it works or write one on your own? Check out this blog post

Install

npm i @vue-reactivity/watch

Usage

Note: since there is no Vue instance to be bond, watch will NOT be auto disposed. You need to always explicitly call the returning function to stop it. Or you can try @vue-reactivity/scope which will auto collect the effects for you.

Just like what you do in Vue.

import { ref, reactive, computed } from '@vue/reactivity'
import { watch, watchEffect } from '@vue-reactivity/watch'

const count = ref(1)

const stopWatch = watch(
  count,
  (newValue) => {
    console.log(`Count: ${newValue}`)
  }
)

count.value += 1
// Count: 2

stopWatch()

License

MIT