useLocalStorage on Nuxt3

[tasiotas]

Hi,

Can someone help me with persisting state with Nuxt3?
I found a great tutorial about this, followed as close as I could. The only difference I can think of, is that example is in Vue3, I use Nuxt3.

Below code writes to localStorage at page load. But once I update msg value, it gets to default after page reload. Cannot figure out why. Should't it check for localStorage first and use its value if it exists?

Thank you!

/stores/auth.js

import { useLocalStorage } from '@vueuse/core'
import { defineStore } from 'pinia'

export const useAuthStore = defineStore('auth', () => {
  const state = ref(useLocalStorage('auth', { msg: 'yo' }))

  const updateMsg = (newMsg) => {
    state.value.msg = newMsg
  }

  return {
    state,
    updateMsg,
  }
})