Vue方法适用于更新但不适用于挂载的

Question

我有一个在mounted生命周期钩子上调用的Vue方法。出于某种原因，如果我刷新它不起作用，但如果浏览器在开发中是热关联的话。我希望返回一个对象。相反，它是未定义的。

data () {
  return {
    randomAd: '',
    startingIndex: 0,
    businesses: [...]
  }
},
mounted () {
    this.getRandomAd()
  },
  methods: {
    getRandomAd () {
      console.log(this.businesses.length)
      let randomNum = Math.floor(Math.random() * this.businesses.length)
      console.log(randomNum)
      this.startingIndex = randomNum
      let randomAd = this.businesses[randomNum]
      this.randomAd = randomAd
      console.log(this.businesses[randomNum])
    },

三个控制台日志的输出为：[__ob__: Observer]，0,和undefined。第一个对象包含所有数据，但它似乎在randomNum处断开。

当浏览器热重新加载后，我得到了[__ob__: Observer]，17，11所期望的内容。

更新

我刚刚意识到数据来自firebase。如果我删除firebase businesses数组并创建一个虚拟数组，则此代码可以正常工作。我需要在某处添加async/await吗？我觉得奇怪的是，数组的第一个console.log显示已存在的数据。