小编Chr*_*ger的帖子

有几个类似的问题，但没有一个能帮助我真正理解在（类）组件中使用 GraphQL，而不是 pages 文件夹中的那些。

我的项目结构是这样的：

-src
--components
---aboutBody
----index.js
--pages
---about.js

我有一个名为about（Prismic 单页类型）的页面组件，并设置了一些组件来“填充”这个页面（为了更好的可读性进行了清理）。

class AboutPage extends Component {

  render() {
    return (
        <LayoutDefault>
          <AboutBody
            introHeadline={this.props.data.prismicAbout.data.intro_headline.text}
            introParagraph={this.props.data.prismicAbout.data.intro_paragraph.text}
          />
        </LayoutDefault>
    )
  }

}

export default AboutPage

这就是我的查询的样子（在两个文件中都是这样的）：

export const aboutQuery = graphql`
  query About {
    prismicAbout {
      data {

        # Intro Block
        intro_headline {
          text
        }
        intro_paragraph {
          text
        }
      }
    }
  }
`

（如果我在底部缺少一个括号，这是由于清理了 SO 的查询示例——如前所述，它在我的页面组件中工作）。

我的 graphql 查询位于AboutPage页面组件的底部。它就像一个魅力和预期的那样。

但是为了稍微清理一下这个页面，我想创建适当的组件并将我的查询放在每个组件中（例如aboutBody，aboutCarousel），再次清理一下：

class AboutBody extends …

目前正在学习React，需要获得clicked元素的支持。我设法得到了它，但感觉不像是“正确”的反应方式。

这是我所拥有的（有效）：

filterProjects = (event) => {
  const value = event.currentTarget.getAttribute("filterTarget")
  console.log(value)
}

最初，我尝试了多种方法，例如： const value = this.props.filterTarget或const value = event.currentTarget.this.props.filterTarget什至使用，ref但undefined在控制台记录该值时全部返回。

（this.props因为它是类Component的一部分，所以使用）。

这是我的目标元素的样子：

const categories = data.allPrismicProjectCategory.edges.map((cat, index) => {
      return (
        <a
          key={index}
          onClick={this.filterProjects}
          filterTarget={cat.node.uid}
        >
          {cat.node.data.category.text}
        </a>
      )
    })

来自 SQL/Rails 背景的我有一个项目，我想使用 Firebase/Firestore（带有 React），并寻求帮助来设置数据和集合结构。

“楷模”：

• 用户
• 项目
• 类别
• 地点

一个用户可以拥有多个项目，一个项目属于一个用户。一个类别可以有多个项目，一个项目属于一个类别。

我需要能够在主页上显示所有类别、位置和项目。首先，我需要列出所有项目，并且可以按类别和/或位置过滤它们。

如何在 Firestore 中最好地设置该数据？

抱歉我用的是 Rails 风格的解释，但我脑子里全是 SQL。

我需要将 Next.js 应用程序部署到支持 Node.js 的共享托管服务提供商。Next.js 官方文档说您（仅？）需要next start在服务器上运行（我猜是通过 SSH）。

1. 我只需要部署build版本还是需要通过 ssh 在服务器上运行构建命令？
2. npm start一旦构建准备好，运行真的是我唯一需要做的事情吗？我有点担心服务器因任何原因停止并且站点关闭。我GOOGLE了不少，发现一些人利用提pm2（参见本文章freeCodeCamp。）但不知道Next.js也许在生产时会自动重新启动服务器？