NuxtN
Nuxt•3y ago
markusgx

Composable used in Component is not reactive

I created a composable "useTimeRecordings()" where I manage state of a few fields e.g.: 

function useTimeRecordings() { ...
const recordingsPage = useState<number>('recordings-page', () => 1)
const recordings = useState<TimeRecord[] | null>('recordings', () => null)

if (recordings.value === null) {
    fetchRecordings(true).then(() => {
      console.log('fetch', recordings.value) //recordings set correctly...
    })
  }

return {
    recordings: computed(() => recordings.value)
  }
}


And in my component I am using: 

const {recordings} = useTimeRecordings()


And this value is not updated. Any idea why? I am assigning the array correctly, I am using computed props as return and yeah. 🤔

Is it because i am not "awaiting" the records? 🤔
Was this page helpful?