将从 API 获取的动态元标记添加到 nuxtjs 静态站点

Adding dynamic meta tags fetched from API to nuxtjs static site

我有一个包含 Nuxt 和来自 Strapi 的内容的静态站点。我想动态设置异步获取的元标记。

我的站点有一个索引页面,它通过 props 将获取的数据传递到 index-web 或 index-mobile。

let pageMeta: any
const apiBase: string = 'https://strapi.xyz.com'

export default Vue.extend({
  components: { Greeting, Showcase, Features, Footer },

  props: {
    data: Map,
    pageMeta,
  },

  data() {
    return {
      loading: true,
    }
  },

  metaInfo(): any {
    return {
      meta: [
        {
          hid: 'description',
          name: 'description',
          content: pageMeta.description,
        },
        {
          hid: 'author',
          name: 'author',
          content: pageMeta.author,
        },
      ],
    }
  },
})

在 JSON 解析对象中传递的 prop。

这样做后,生成的站点没有添加元标记。

如前所述,您需要使用 .this 访问 属性。