首页 > 解决方案 > 将从 API 获取的动态元标记添加到 nuxtjs 静态站点

问题描述

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

我的网站有一个索引页面,它通过道具将获取的数据传递给 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 解析对象中传递的道具。

完成此操作后,生成的站点没有添加元标记。

标签: vue.jsnuxt.jsmeta-tagsstatic-site

解决方案


如前所述,您需要使用.this.


推荐阅读