React Gatsby Graph QL - 过滤站点地图的文章

Posted

技术标签:

【中文标题】React Gatsby Graph QL - 过滤站点地图的文章【英文标题】:React Gatsby Graph QL - filter articles for sitemap 【发布时间】:2021-10-31 16:51:03 【问题描述】:

我使用 Flexiblocks 创建了一个 Gatsby 博客。问题是我想专门为Google News 创建一个站点地图,这将不同于博客的主站点地图。对于这个站点地图,我需要过滤过去两天内发布的文章。 我正在使用这个plugin

 allArticle(sort: order: DESC, fields: date, filter: date: WHAT_SHOULD_I_DO_HERE) 
    edges 
      node 
        date
        excerpt
        title
        link
        slug
      
    
  

任何帮助将不胜感激,谢谢。

更新

date: gte: "2021-08-27T13:11:30.443Z" 将过滤文章,但我如何动态获取此日期字符串?

【问题讨论】:

【参考方案1】:

Gatsby 在处理 GraphQL 范围内的日期时依赖于 momentjs。您只需要在查询范围内添加从函数返回的变量,例如:

const getTwoDaysAgo=()=> moment().subtract(2, "days");

在您的gatsby-config.js 中,您只需调用此函数即可:

要添加变量,您可以按照您的答案:Variables in graphQL queries

基本上,遵循以下语法:

grapqhl(
     `query getImages($fileName: String) 
      landscape: file(relativePath: eq: $fileName) 
        childImageSharp 
          fluid(maxWidth: 1000) 
            base64
            tracedSVG
            aspectRatio
            src
            srcSet
            srcWebp
            srcSetWebp
            sizes
            originalImg
            originalName
           
         
       
     
    `,
    fileName: "knight.jpg"
   )

您可以添加自定义变量。在这种情况下,请注意查询包含在 graphql() 函数中。应用于你的情况,你可以试试:

plugins: [
    
        resolve: `gatsby-plugin-advanced-sitemap`,
        options: 
          query: graphql(
             ` 
              query allArticle(
               sort: 
                 order: DESC, fields: date
               , 
              filter: date: twoDaysAgo) 
              edges 
                node 
                  date
                  excerpt
                  title
                  link
                  slug
                
              
            `, twoDaysAgo: getTwoDaysAgo()
          )
      
    
 ]

注意:复制/粘贴时要小心,因为我可能会遗漏很多括号。

我不确定插件是否支持这种表示法,但应该支持。


日期:gte:“2021-08-27T13:11:30.443Z”

鉴于已编辑的问题,将流程和过滤器调整为 gte 参数。

【讨论】:

谢谢,我会试试这个并告诉你 我无法在 gastby-config.js 中使用它 :(

以上是关于React Gatsby Graph QL - 过滤站点地图的文章的主要内容,如果未能解决你的问题,请参考以下文章

模拟 graph-ql 请求

AWS amplify Graph QL 按书名和作者姓名过滤

如何在 Gatsby 中使用 React.lazy

gatsby-plugin-react-svg 导致太多递归错误

React-slick 与 gatsby-plugin-image

React / Gatsby - 根据屏幕大小渲染不同的组件