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

Question

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

在子组件中接收

在生成时，元标记存在但在 ssr 上不存在：/

我尝试使用 async 和 await，但我仍然收到错误

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)
  })
},

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

Nuxt: Dynamic head / meta title is undefined on ssr

javascript

meta-tags

nuxt.js