过滤WordPress按类别帖子 - GraphQl和Gatsby.js的问题

Question

我想在我的gatsby.js页面上列出所有wordpress帖子，并在用户单击类别标签时按类别过滤它们。选择类别后，我将其保存为" ChooSencategory"变量，它是字符串。我有一个问题找到一种将变量传递到我的查询的方法，而这种方法不起作用：

const chosenCategory = "myCategory";
const PostListingData = (props) => (
  <StaticQuery
    query={graphql`
      query($name: String = chosenCategory)  {
        allWordpressPost(filter:
          { categories:
            { elemMatch:
              { name:
                { eq:
                 $name
                }
              }
            }
          }
        )
      {
          edges {
            node {
              id
              title
              categories {
                name
              }
            }
          }
        }
     }
    `}
    render={data => <PostsListing data={data} {...props} />}
  />
)
const PostsListing = ({ data }) => {
  return (
    <div>
        {data.allWordpressPost.edges.map(({ node }, i) => (
          *** some code ***
         ))}
    </div>
)}

Answer 1

只是为了澄清，此原因是因为盖茨比无法生成基于运行时变量集的内容动态加载内容的站点。如果它确实接受了您编写的代码，则只能生成一个类别" mycategory"。盖茨比不这样做，而只是拒绝查询中的变量。

根据我的经验，有一些选择：

1. 使用gatsby-node.js为每个类别生成页面。https://www.gatsbyjs.org/tutorial/part-seven/

2. 使用搜索插件。本质上，此选项是基于所有帖子生成的树，并将其放在搜索上显示的页面上。

3. 进行自己的搜索。这类似于＃2。您将必须引入所有帖子，为所有帖子制作组件，然后将它们设置为基于搜索组件状态的可见。