[SOLVED] Computed property that relies on Vuex stored prop not updating?

Computed property that relies on Vuex stored prop not updating?

When reservation is updated (which it is, I can see it change in the template through things like {{ reservation.id }}) the following computed property (reservationHashedId) is not... Why?

const reservation = computed(() => store.state.infoPaneReservation)
    
const reservationHashedId = computed(() => {
      return reservation.hashedId ? reservation.hashedId : 'Unknown reservation'
})

According to my understanding a computed property get re-evaluated when an internal property is changed... so why doesn't it work?

Referencing the stored property directly in the computed property makes it work...

const reservation = computed(() => store.state.infoPaneReservation)
    
const reservationHashedId = computed(() => {
      const reservation = store.state.infoPaneReservation // Adding this works
      return reservation.hashedId ? reservation.hashedId : 'Unknown reservation'
})

...but surely there's a better way?

Solution

So the reason is that reservation.hashedId is not reactive, but reservation.value.hashedId is.

So changing all my references in my computed properties from reservation. to reservation.value. fixed everything.