[Vuejs]-VueUse useDark() does not trigger computed or watch

neither watch or computed did it for me. I rather used this function, as it is already documented.

import { useDark } from '@vueuse/core'

const isDark = useDark({
  onChanged(dark: boolean) {
    // update the dom, call the API or something
    console.log('hello', dark)
  },
})

I guess you need to use your watch like this:

watch(() => isDark, (newValue) => {
  console.log(newValue);
})

regarding the computed I am not sure if it can work like that, I’ve never seen a computed being initialised like that.

it probably should look like this:

const state = computed(() => isDark.value ? 'dark' : 'light');

I have the same problem, mainly because I tried to use it in many location, it just doesn’t make sense I figured

const isDark = useDark()
const toggleDark = useToggle(isDark);

watch: {
    isDark: {
      handler(val) {
        useThemeConfigStore.setTheme(val == true ? "dark" : "light");
      },
    },
  },

I have simply remove on the other files, and just use pinia or vuex to watch over the state