0

私はこのことに行き詰まっています。URLからurlパラメータ(/mypage/?title=my-title)を取得してページに表示したいです。現在、ギャツビーでクライアントのみのルートを試しました

import path from "path"
exports.onCreatePage = ({ page, actions }) => {
  const { createPage } = actions
    if (page.path.match(/^\/headline\/*/)) {
      createPage({
        path: "/headline",
        matchPath: "/headline/*",
        component: path.resolve("src/templates/headline.tsx"),
    })
  }
}
// gatsby-node.js

これが私のテンプレートです

    import React  from "react"
    import { Router, RouteComponentProps } from "@reach/router"
    
    type Props = RouteComponentProps<{
      title: string
    }>
    const Test = ({ title = "Test title", location }: Props) => {
      console.log(title)
      console.log(location)
      return <h1>Im test</h1>
    }
    
    const Headline = () => {
      console.log("handle temp called")
      return (
        <Router>
          <Test path="/compare/headline/:title" />
        </Router>
      )
    }
    export default Headline
    // src/templates/headline.tsx

/headline/?title=test-my-app を押しても何もレンダリングされない コンポーネント (Test) が Router タグから呼び出されていません。助けはありますか?

4

1 に答える 1