如何与盖茨比查询理智博客文章

发布于 2025-02-09 00:55:23 字数 1333 浏览 3 评论 0原文

我有一个盖茨比网站，该网站设置了Sanity CMS用于博客。当前我无法正确针对单个博客文章（单击“第一个博客”链接将呈现“第二博客”的内容）。

当前行为：

我的猜测是这是由于 template/blog.js ？如果是这样，将需要进行哪些更改才能正确针对单个博客文章？

//templates/blog.js
...
export const query = graphql`
  query {
    sanityPost {
      id
      slug {
        current
      }
      title
      publishedAt(formatString: "MMM Do, YYYY")
      _rawBody
    }
  }
`

const BlogPost = ({ data }) => {
  return (
    <Layout>
      <h1>{data.sanityPost.title}</h1>
      <p>{data.sanityPost.publishedAt}</p>
      <PortableText value={data.sanityPost._rawBody} />
    </Layout>
  )
}

export default BlogPost

最后，可以在此处找到博客页面本身的代码源： blog.js 在这里工作样本：演示。

提前致谢！

原文

I have a Gatsby site set up with Sanity CMS for blogging. Current I am unable to properly target individual blog post(clicking on "First Blog" link will render content from "Second Blog").

Current Behavior:

My guess would be this is due to how graphQL query is setup in template/blog.js? If so, what changes would need to be made to properly target individual blog post?

//templates/blog.js
...
export const query = graphql`
  query {
    sanityPost {
      id
      slug {
        current
      }
      title
      publishedAt(formatString: "MMM Do, YYYY")
      _rawBody
    }
  }
`

const BlogPost = ({ data }) => {
  return (
    <Layout>
      <h1>{data.sanityPost.title}</h1>
      <p>{data.sanityPost.publishedAt}</p>
      <PortableText value={data.sanityPost._rawBody} />
    </Layout>
  )
}

export default BlogPost

Lastly, the code source for the blog page itself can be found here: blog.js and working sample here: demo.

Thanks in advance!

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

红墙和绿瓦 2025-02-16 00:55:23

我是通过通过 sanity-sanity-gatsby-combo-combo-combo 演示。在模板/blog.js 中，我需要创建$ id变量才能定位每个帖子的ID。

//templates/blog.js

...
export const query = graphql`
  query($id: String!) {
    sanityPost(id: {eq: $id}){
      id
      slug {
        current
      }
      title
      publishedAt(formatString: "MMM Do, YYYY")
      _rawBody
    }
  }
`
...

fwiw这是请求/响应：

使用正确路由到单个博客的工作示例： https://deploy-preview-85-simonxcode.netlify.app/blog

自我注释：学习GraphQl基础知识！

I was to figure it out by parsing through sanity-gatsby-combo demo. In templates/blog.js I needed to create $id variable to target the id of every post.

//templates/blog.js

...
export const query = graphql`
  query($id: String!) {
    sanityPost(id: {eq: $id}){
      id
      slug {
        current
      }
      title
      publishedAt(formatString: "MMM Do, YYYY")
      _rawBody
    }
  }
`
...

FWIW here is the request/response: