当我在 Next.js 中从 drupal graphql 查询中获取数据时，一直未定义

Question

我不熟悉在 Next.js 中从 graphql 获取数据。当我它给我未定义的。它在操场上运行良好，但在 next.js 上出现问题。

这里是用于显示标签和链接路径的代码 mainMenu.tsx。

import Link from 'next/link';
import { GET_MENU_LINKS } from 'pages/api/queries';
import client from 'pages/api/apollo-client';


const MainMenu = ({ data}) => {
    const getMainLinks = () => {
        let array: JSX.Element[] = [];
        data.links.forEach((link: any, index: number) => {
            array.push(
                <Link href={link.url.path} key={index}>
                    <a className="nav-link">
                        {link.label}
                    </a>
                </Link>
            );
        });
        return array;
    }
    return (
        <>
            <ul className="navbar-nav ms-auto">
                {getMainLinks()}
            </ul>
        </>
    )
}

export async function getStaticProps() {

    const { data } = await client.query({
        query: GET_MENU_LINKS,
    });
    

    return {
        props: {
            data: data || null
        },
    };
}

export default MainMenu;

这是我的查询：

export const GET_MENU_LINKS = gql`
  query getMenuLinks {
    menuByName(name: "main") {
      links {
        label
        url {
          path
        }
      }
    }
  }
`;

当我 console.log(data) 它返回未定义？我错过了什么？

谢谢