2

のルート クエリがありますsongs。これはページネーション コンテナにあります。comments次に、曲ごとに 10,000 件のコメントを一度に読み込みたくないので、ページネーションも行いたいという曲のネストされたプロパティがあります。

songContainer.js:

fragment songsContainer on Query {
    songs(
      first: $count
      after: $cursor
      genre: $genre
      filter: $filter
    ) @connection(key: "songsContainer_songs") {
      edges {
        node {
          audioId
          name
          coverImageUrl
          artist
          likes
          dislikes
          ...commentsContainer
        }
      }
    }
  }

const connectionConfig = {
  direction: 'forward',
  query: graphql`
    query songsContainerForwardQuery(
      $count: Int!
      $cursor: String
      $genre: String
      $filter: FilterInput
    ) {
      ...songsContainer
    }
  `,
  getVariables: (_, { count, cursor }) => ({
    count,
    cursor,
  }),
};

paginationContainer(fragments, connectionConfig);

コメントContainer.js

  fragment commentsContainer on Audio {
    comments(
      first: $count
      after: $cursor
      getReplies: $getReplies
    ) @connection(key: "commentsContainer_comments") {
      edges {
        node {
          commentId
          body
          date
          likes
          dislikes
          repliesCount
          originalComment {
            id
          }
          user {
            userName
          }
        }
      }
    }
  }

コメントの connectionConfig をどのように記述すればよいですか? 私はこれを試しました:

const connectionConfig = {
  direction: 'forward',
  query: graphql`
    query commentsContainerForwardQuery(
      $count: Int!
      $cursor: String
    ) {
      ...commentsContainer
    }
  `,
  getVariables: (_, { count, cursor }) => ({
    count,
    cursor,
  }),
};

しかし、コメントは曲にネストされているため、ルートにクエリが存在しないというエラーがスローされます。

4

1 に答える 1