为什么会出现“this.$nuxt.$loading.start is not a function”的错误

如果直接在 mounted 方法中调用 $loading 对象,可能会报“this.$nuxt.$loading.start is not a function”这个错误,因为这个时候 $loading 对象并没有创建完成:

export default {
  mounted () {
    // 错误的代码
    this.$nuxt.$loading.start()
  }
}

如果在 mounted 方法中使用它,要使用 this.$nextTick 来调用它:

export default {
  mounted () {
    // 正确的代码
    this.$nextTick(() => {
      this.$nuxt.$loading.start()
      setTimeout(() => this.$nuxt.$loading.finish(), 500)
    })
  }
}

注:如果在 click 事件中调用 $loading 就不会出现上述问题。


前一篇:
后一篇:

发表评论