Сортировка запроса GraphQL по нескольким запросам в Гэтсби - PullRequest
0 голосов
/ 14 января 2020

Я использую Gatsby в качестве моего генератора данных c и Contentful в качестве моего источника данных.

У нас есть несколько contentTypes в Contentful (блог, событие, технический документ), и я хочу вернуть их в течение один запрос и отсортировано по дате создания. До сих пор у меня есть следующее, которое возвращает каждый contentType в порядке каждого contentType, но не в порядке даты в целом.

Есть ли способ сделать сортировку по всему запросу?

{
    whitepapers: allContentfulWhitepaper(sort: { order: DESC, fields: createdAt }) {
      edges {
        node {
          id
          slug
          title
        }
      }
    }
    blogs: allContentfulBlogPost(sort: { order: DESC, fields: createdAt }) {
      edges {
        node {
          id
          slug
          title
        }
      }
    }
    events: allContentfulEventPage(sort: { order: DESC, fields: createdAt }) {
      edges {
        node {
          id
          slug
          title
        }
      }
    }
  }

1 Ответ

1 голос
/ 14 января 2020

Я не думаю, что запрос GraphQL может выполнять сортировку по нескольким полям, но вы можете сортировать по компоненту

import React from 'react';
import { graphql } from 'gatsby';

const IndexPage = ({ data }) => {
  const { whitepapers, blogs, events } = data;
  const allDataInDesc = [
    ...whitepagers.edges.map(e => e.node),
    ...blogs.edges.map(e => e.node),
    ...events.edges.map(e => e.node),
  ].sort((a, b) => { return new Date(a.createdAt) > new Date(b.createdAt) ? -1 : 1; });

  return <>...</>
}

export const query = graphql`
  {
    whitepapers: allContentfulWhitepaper(sort: { order: DESC, fields: createdAt }) {
      edges {
        node {
          id
          slug
          title
          createdAt
        }
      }
    }
    blogs: allContentfulBlogPost(sort: { order: DESC, fields: createdAt }) {
      edges {
        node {
          id
          slug
          title
          createdAt
        }
      }
    }
    events: allContentfulEventPage(sort: { order: DESC, fields: createdAt }) {
      edges {
        node {
          id
          slug
          title
          createdAt
        }
      }
    }
  }
`;

export default IndexPage;
...