JSON-LD 架构 NUXT

Question

我正在创建一个由 Wordpress 提供支持的 Nuxt 应用程序。

我通过模式 plugin.Like 在我的 WP REST API 中收到 JSON-LD 所以，

{
  wp_post_schema: "{"@context":"https://schema.org"}"
}

下面是我在NUXT中的使用方法

head(){
    return {
        title: 'This is my page title',
        meta: [
            { hid: 'description', name: 'description', content: 'This is my description' }
        ],
        script: [
            {
                json: this.POST.wp_post_schema
                type: 'application/ld+json'
            }
        ],
    }
},
async asyncData({ $axios, req, params, query, error, route }) {
    var POST;
    try {
      let response = await $axios.get( "https://www.example.com/api);
      return {
        POST: response.data[0].post_meta_fields
      };
    } 
  }

我的问题是页面上呈现的 JSON-LD 已经过清理，无法被 google 标记工具识别。关于如何有效实施模式标记有什么建议吗？

Answer 1

您应该使用 v-html 来显示更干净的内容。

<template>
  <script v-html="POST", type="application/ld+json">
</template>

JSON-LD 架构 NUXT

JSON-LD Schema NUXT

javascript

vue.js

vuejs2

nuxt.js

json-ld