@24hr/react-structured-data 中文文档教程

发布于 3年前 浏览 23 项目主页 更新于 3年前

@24hr/react-structured-data

这是一个简单的 React 组件,用于将脚本标记呈现为 application/ld+json 类型。 这可用于根据 Schema.org 定义为 Google 搜索创建结构化数据。

How to use

  1. Import the module
import StructuredData from '@24hr/react-structured-data';
  1. Use it
<StructuredData type={structureDataType} {...structuredDataObject} />

Props - General

PropTypeDefault
contextstringhttps://schema.org
typestring (required)undefined

然后,您可以根据需要将任何结构化数据兼容对象传递给它。 这些只是传递。

Props - FAQPage component

PropTypeDefault
questionsarray (required)

问题对象应具有以下结构:

{
    question: String,
    answer: String
}

Example - FAQ Page

导入内置的 FAQPage 组件

import React from 'react';
import { FAQPage } from '@24hr/react-structured-data';

const App = () => (
    <div>
        {/* Your content */}
        <FAQPage
            questions={[
                {
                    question: 'Test',
                    answer: 'Okey'
                }
            ]}
        />
    </div>
);

@24hr/react-structured-data

This is a simple React component to render a script tag as type application/ld+json. This can be used to create structured data for Google search according to the Schema.org definition.

How to use

  1. Import the module
import StructuredData from '@24hr/react-structured-data';
  1. Use it
<StructuredData type={structureDataType} {...structuredDataObject} />

Props - General

PropTypeDefault
contextstringhttps://schema.org
typestring (required)undefined

You can then pass it whatever structured data compatible objects as you want. These are just passed along.

Props - FAQPage component

PropTypeDefault
questionsarray (required)

A question object should have the structure:

{
    question: String,
    answer: String
}

Example - FAQ Page

Import the built-in FAQPage component

import React from 'react';
import { FAQPage } from '@24hr/react-structured-data';

const App = () => (
    <div>
        {/* Your content */}
        <FAQPage
            questions={[
                {
                    question: 'Test',
                    answer: 'Okey'
                }
            ]}
        />
    </div>
);
    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文