GraphQL + Relay 现代片段给了我一系列空帖子

Posted 2023-03-08

【中文标题】GraphQL + Relay 现代片段给了我一系列空帖子

【英文标题】：GraphQL + Relay modern fragment gives me an array of null posts

【发布时间】：2018-02-04 23:07:51

【问题描述】：

我正在使用 Relay Modern、GraphQL 和 Graphcool 开发一个 React Native 应用程序。我正在尝试从数据库中获取帖子，我有 3 个文件，Post.js、PostList 和 index.js。

PostList.js：

export default createFragmentContainer(PostList, graphql`
  fragment PostList_viewer on Viewer 
    allPosts(last: 100, orderBy: createdAt_ASC) @connection(key: "PostList_allPosts", filters: []) 
      edges 
        node 
          ...Post_post
        
      
    
  
`)

Post.js

export default createFragmentContainer(Post, graphql`
  fragment Post_post on Post 
    id
    content
    createdAt
    author 
      id
      username
    
  
`)

index.js

const Feed = () => (
  <QueryRenderer
    environment=environment 
    query=AllPostQuery
    render=( error, props ) => 
      if (error) 
        return <div>error.message</div>
       else if (props) 
        return <PostList viewer=props.viewer />
      
      return <Text>Loading</Text>
    
  />
)

当我在 PostList.js 中控制台日志this.props.viewer.allPosts 时，我得到 edges: [ null, null, null ], ...。我在数据库中有 3 个帖子，所以它正在查找帖子，但为什么它们为空？请

【参考方案1】：

首先，如果您遇到问题，请尝试记录“根”对象，它是 props，而不是其中的分支 - 这将使您更容易解开数据结构。

另外，据我所知，Relay 有一些魔力，它使数据仅在您定义片段的文件中对您可用，因此在 PostList.js 中您不会看到帖子的详细信息。尝试从 Post.js 打印数据。这可能是您看到 null 值打印的原因。

此外，来自 GraphQL 的数据将在从 _（下划线）之后的片段名称派生的变量名称下可供您使用，因此在您的示例中它将是 post 而不是 allPosts。

【讨论】：

我知道这一切，这些都不是我的问题，.另外，allPosts 没有错，它是我从 Graphcool 得到的对象的一部分，我得到的对象是 viewer: allPosts: edges: node... 。没有什么对我有用，甚至没有使用post。我的问题最终是身份验证。