google / google/react-schemaorg
Script not showing up in page source
- 主要言語
- TypeScript
- スター
- 521
- フォーク
- 20
- PR マージ指標
- 30日以内にマージされた PR はありません
説明
Hi,
I'm new to this, so maybe I'm missing something... I'm under the impression that the point of this library is to be able to insert JSON-LD in any functional component, and also be readable by Google Rich Results (that apparently will replace GDT).
I have inserted this sample in my functional component, displayed when I'm at localhost:3000/integrations (redirection handled via React Router. This is a single JSON-LD object, but eventually there will be a loop to create multiple ones with variables. The "name" property already has a variable as it's value, as you can see below.
```
return (
item={{
"@context": "https://schema.org",
"@type": "Person",
"address": {
"@type": "PostalAddress",
"addressLocality": "Colorado Springs",
"addressRegion": "CO",
"postalCode": "80840",
"streetAddress": "100 Main Street"
},
"colleague": [
"http://www.example.com/JohnColleague.html",
"http://www.example.com/JameColleague.html"
],
"email": "info@example.com",
"image": "janedoe.jpg",
"jobTitle": "Research Assistant",
"name": name,
"alumniOf": "Dartmouth",
"birthPlace": "Philadelphia, PA",
"birthDate": "1979-10-12",
"height": "72 inches",
"gender": "female",
"memberOf": "Republican Party",
"nationality": "Albanian",
"telephone": "(123) 456-6789",
"url": "http://www.example.com",
"sameAs" : [ "https://www.facebook.com/",
"https://www.linkedin.com/",
"http://twitter.com/",
"http://instagram.com/",
"https://plus.google.com/"]
}}
/>
)
```
However, when I check the page source, I only get the contents of my index.tsx which is the standard React prebuilt code with the root div where the App component goes. My question is this: Where do the inserted scripts go when I use the JSONLd component? Because when I go run them in the validator, they are not found.
Thank you!
コントリビューションガイド
調査の方向性
表示されている JsonLd コンポーネントを使用して localhost:3000/integrations の報告を再現し、index.tsx とレンダリングされたページのソースを調査する。ソースに表示される内容と、validator が受け取る内容を比較する。動作が説明され、JSON-LD が期待どおりに検出できるか、または issue に必要な使用方法が記録されていれば完了とする。
索引モデルが issue の本文から書いたものです。
評価
- 技術スタック
- react, typescript
- 領域
- frontend, web-dev
- issue の種類
- バグ
- 難易度
- 3/5
- 見積もり時間
- 1〜2日
- 活発さ
- 停滞
- 明瞭さ
- 説明が足りない
- 初心者へのやさしさ
- 35/100