@24hr/react-structured-data 中文文档教程
@24hr/react-structured-data
这是一个简单的 React 组件,用于将脚本标记呈现为 application/ld+json
类型。 这可用于根据 Schema.org 定义为 Google 搜索创建结构化数据。
How to use
- Import the module
import StructuredData from '@24hr/react-structured-data';
- Use it
<StructuredData type={structureDataType} {...structuredDataObject} />
Props - General
Prop | Type | Default |
---|---|---|
context | string | https://schema.org |
type | string (required) | undefined |
然后,您可以根据需要将任何结构化数据兼容对象传递给它。 这些只是传递。
Props - FAQPage component
Prop | Type | Default |
---|---|---|
questions | array (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
- Import the module
import StructuredData from '@24hr/react-structured-data';
- Use it
<StructuredData type={structureDataType} {...structuredDataObject} />
Props - General
Prop | Type | Default |
---|---|---|
context | string | https://schema.org |
type | string (required) | undefined |
You can then pass it whatever structured data compatible objects as you want. These are just passed along.
Props - FAQPage component
Prop | Type | Default |
---|---|---|
questions | array (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>
);