問題タブ [yaml-front-matter]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
reactjs - 投稿/URLに応じてメインレイアウトに異なるヒーロー画像を設定する(graphQLからデータを取得)[GATSBY]
編集: このGithub リポジトリにデモがあります。
投稿/ページ (そのスラッグ) に従って、ブログのメイン レイアウトのヒーロー画像を変更する必要があります。
すべての投稿には、フロントマター情報に設定されたヒーロー画像があります。
私はすべてを試しましたが:
1.(最後の投稿の)同じ画像のみを表示します-これは、markdownRemark
反復せずに思い出すと発生します。
2.または、で反復した後にキー小道具(すでに設定済み)が必要であることを教えてくれますallMarkdownRemark
。
これが私の最後の試みです。GraphQl を介してデータを取得し、条件を設定しました (ホームページの場合はメインのヒーロー画像を表示し、それ以外の場合は、単一の投稿のフロントマター情報にある画像を表示する必要があります)。
これはレイアウト コンポーネント全体です。
私はすべてのガイドに従いましたが、まだ不足しているものを取得できません。私は反応するのが初めてで、JavaScriptの専門家ではありません。これが初心者の質問である場合は申し訳ありません.
助けてくれてありがとう。