将从 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
访问 属性。
我有一个包含 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
访问 属性。