Strapi / Graphql。我究竟做错了什么?

Strapi / Graphql. What am i doing wrong?

抱歉,我完全是业余爱好者。我在 Strapi cms 中有简单的 api 与两种类型(博客和画廊)的关系。我正在尝试从 api 中获取数据,但我不知道如何从嵌套数组(?)画廊类型中获取数据。

import { useQuery } from "@apollo/react-hooks";
import { gql } from "apollo-boost";
import {Row, Col} from './../../style/grid'

const GET_POSTS = gql`
   {
    blogs {
      id
        title
        article
            galleries {
                id
                title
                    image {
                    id
                    name
                    url
                    }
            }

      }
   }
`;

function Blog() {
    const { data } = useQuery(GET_POSTS);
    if (data && data.blogs) {

        return (
            <>
                {data.blogs.map((post) => (

                    <Row>
                        <Col key={post.galleries.title}>
                            {post.galleries.image.url} //this not
                        </Col>

                        <Col key={post.id}>
                           {post.title} {post.article} //this works
                        </Col>
                    </Row>

                    ))}
                    </>
        );
    }
    return <div>Loading...</div>;
}

export default Blog;

这是我的 JSON:

[{"_id":"5d56f4dfc601e70a9785453a","title":"First title","article":"First article","createdAt":"2019-08-16T18:24:31.032Z","updatedAt":"2019-08-17T08:02:07.239Z","__v":0,"id":"5d56f4dfc601e70a9785453a","gallery":"5d56f51c6e8e180ac8492ef2","image":null,"galleries":[{"_id":"5d56f51c6e8e180ac8492ef2","title":"First foto","createdAt":"2019-08-16T18:25:32.356Z","updatedAt":"2019-08-17T08:02:21.294Z","__v":0,"id":"5d56f51c6e8e180ac8492ef2","blog":"5d56f4dfc601e70a9785453a","image":{"_id":"5d56f61eac3eec0b07ec6f7f","name":"bee19c02512ae0a00b2ddea17c2f0096337451ba-600x600.jpeg","sha256":"RPmvBrSJo7kZSyyqEy0ux3Z6A96iR53CEEIizvhIqn4","hash":"5a554a230e5a4efb9172bbd489eb8860","ext":".jpeg","mime":"image/jpeg","size":"20.98","url":"/uploads/5a554a230e5a4efb9172bbd489eb8860.jpeg","provider":"local","related":["5d56f51c6e8e180ac8492ef2"],"createdAt":"2019-08-16T18:29:50.792Z","updatedAt":"2019-08-16T18:29:50.800Z","__v":0,"id":"5d56f61eac3eec0b07ec6f7f"}},{"_id":"5d5712956f100c0b4093280e","title":"Second foto","createdAt":"2019-08-16T20:31:17.609Z","updatedAt":"2019-08-17T08:02:29.067Z","__v":0,"id":"5d5712956f100c0b4093280e","blog":"5d56f4dfc601e70a9785453a","image":{"_id":"5d5712956f100c0b4093280f","name":"biurko-delia-debowe.jpg","sha256":"WVubVIkUB43xbPV-cuxHeka9lqmHSyENhH_Oi2UzbHU","hash":"d5c7d4cfaa984405a41daacc0ee20597","ext":".jpg","mime":"image/jpeg","size":"56.36","url":"/uploads/d5c7d4cfaa984405a41daacc0ee20597.jpg","provider":"local","related":["5d5712956f100c0b4093280e"],"createdAt":"2019-08-16T20:31:17.638Z","updatedAt":"2019-08-16T20:31:17.643Z","__v":0,"id":"5d5712956f100c0b4093280f"}}]}]

您还需要映射画廊

function Blog() {
    const { data } = useQuery(GET_POSTS);
    if (data && data.blogs) {

        return (
            <>
                {data.blogs.map((post) => (

                    <Row>
                        {post.galleries.map((gallery) => (
                            <Col key={gallery.title}>
                                {gallery.image.url} //this not
                            </Col>
                         ))}

                        <Col key={post.id}>
                           {post.title} {post.article} //this works
                        </Col>
                    </Row>

                    ))}
                    </>
        );
    }
    return <div>Loading...</div>;
}