如何访问 fetch() 钩子内的 Nuxt 上下文？

Question

我想访问 async fetch() 中的道具，但我也在使用 async fetch(context)。所以，我不确定如何访问道具。

Answer 1

如the documentation所示，在使用fetch() hook like

时可以使用this访问上下文

async fetch() {
  await this.$axios // or whatever this.$i18n etc.....
}

不要按照的说明使用 fetch(context)。

Answer 2

在 Nuxt 2 中，你有 2 个 fetch 钩子。

旧的，在 Nuxt 2.12 之前，fetch(context) 很像 asyncData。它在组件创建之前执行，因此您无权访问它（数据、道具、选项……什么都没有）。
这个已弃用，请改用 asyncData。

新的，来自 Nuxt 2.12，fetch()（无参数）。它与 created() 挂钩同时执行。它可以访问组件的上下文（属性、数据等）。

fetch(context) {
  // "this" doesn't exists
  // context is the Vue global context
}

fetch() {
  this.myProp // "this" exists and have access to props
}

如何访问 fetch() 钩子内的 Nuxt 上下文？

How to access Nuxt context inside of fetch() hook?

javascript

vue.js

nuxt.js