Vue вычисленные свойства теряются при жестком обновлении

Question

У меня есть подкомпонент, который получает некоторые данные через реквизиты, а некоторые через вычисляемые свойства.Он прекрасно работает, пока я не перезагружу жесткую страницу;тогда это терпит неудачу в 'this.attributes.manufacturer', который возвращает неопределенное.Кто-нибудь предложить способ исправить это, пожалуйста?

<template>
  <span>
    {{ manufacturer | htmlDecode }}
  </span>
</template>

<script>
import { mapGetters } from 'vuex'

export default {
  computed: {
    ...mapGetters({
      attributes: 'extraCart/attributeListByCode'
    }),
    manufacturer () {
      let manufacturer = this.product.manufacturer
      if (this.attributes.manufacturer) {
        let option = this.attributes.manufacturer.options.find(av => {
          return av.value === manufacturer
        })
        if (option) {
          return option.label
        }
      }
    }
  },
  props: {
    product: {
      type: Object,
      required: true
    }
  }
}
</script>

<style scoped rel="stylesheet/stylus" lang="stylus">

</style>

Answer 1

Оказалось, что я установил мутации для объекта вместо использования Vue.Set, что сделало эти атрибуты реактивными.Спасибо за помощь ваших парней.

Answer 2

Вы можете добавить некоторые проверки состояния:

if (this.product && this.attributes.manufacturer) {}

export default {
  computed: {
    ...mapGetters({
      attributes: 'extraCart/attributeListByCode'
    }),
    manufacturer () {
      if (this.product && this.attributes.manufacturer) {
        let manufacturer = this.product.manufacturer
        let option = this.attributes.manufacturer.options.find(av => {
          return av.value === manufacturer
        })
        if (option) {
          return option.label
        }
      }
    }
  },
  props: {
    product: {
      type: Object,
      required: true
    }
  }
}