Nuxt：动态头部/元标题在 ssr 上未定义

Question

我有一个 nuxt 项目，其中元标题和描述来自（来自 nuxt/content）。 数据的异步获取在索引中进行，并通过 getter 在子组件中接收。

在生成时，元标记在那里，但在 ssr 上却没有：/

我尝试了异步和等待，但我仍然收到错误

Uncaught (in promise) TypeError: seoTitle is undefined

（我尝试了一个没用的await this.getArticle const，希望整个事情都在等待，这个东西在那里，但是没有）

这是我的代码：

 async head() {
    const article = await this.getArticle
    const seoTitle = await this.getArticle.seoTitle,
      title = await this.getArticle.title,
      seoDescription = await this.getArticle.description

    return {
      title: `"${
        seoTitle.length ? seoTitle : title
      }"`,
      meta: [
        {
          hid: "description",
          name: "description",
          content: `${
            seoDescription.length
              ? seoDescription.slice(0, 50)
              : seoDescription.slice(0, 50)
          }`,
        },
      ],
    };
  },

Answer 1

据我所知，您不能在 head 上使用 async，因为它通常使用一些静态值。

看看这个github answer，看起来你可以使用asyncData来访问你想在head中输入的值。

head() {
  return { title: this.info.title }
},
async asyncData ({ params }) {
  return axios.get(`/post/${params.id}/info`)
    .then((res) => {
      return {
        info: res.data.info
      }
    }).catch((err) => {
      console.log(err)
  })
},