在React中填充Github GraphQL (Gatsby)

Question

我正在尝试创建一个页面来显示我的固定回购。我正在使用gatsby，并且已经安装了gatsby-source-github-api

{
            resolve: 'gatsby-source-github-api',
            options: {
                token: 'xxxxxxxxx',
            },
        },

我让查询在GraphQL plaryground中填充我想要的数据。

      query {
            user(login: "mrpbennett") {
                pinnedItems(first: 6, types: [REPOSITORY]) {
                    edges {
                        node {
                            ... on Repository {
                                name
                                description
                                url
                                primaryLanguage {
                                    name
                                    color
                                }
                            }
                        }
                    }
                }
            }
        }

但是，我正在努力将这些数据填充到我不断获得的7:13 error Cannot query field "user" on type "Query" graphql/template-strings的新组件中

这就是组件

我真的不确定如何填充我需要的数据。

import React from 'react'
import { graphql, useStaticQuery } from 'gatsby'

const PinnedRepos = () => {
    const data = useStaticQuery(graphql`
        query {
            user(login: "mrpbennett") {
                pinnedItems(first: 6, types: [REPOSITORY]) {
                    edges {
                        node {
                            ... on Repository {
                                name
                                description
                                url
                                primaryLanguage {
                                    name
                                    color
                                }
                            }
                        }
                    }
                }
            }
        }
    `)

    return (
        <div>
            <p>{data.node.repository.name}</p>
        </div>
    )
}

export default PinnedRepos

任何建议都将非常感谢​。

Answer 1

查询的语法是这里的问题所在，您需要编写如下查询

const data = useStaticQuery(graphql`
    query user(login: "mrpbennett") {
            pinnedItems(first: 6, types: [REPOSITORY]) {
                edges {
                    node {
                        ... on Repository {
                            name
                            description
                            url
                            primaryLanguage {
                                name
                                color
                            }
                        }
                    }
                }
            }
        }
`)