next.js 下一个,JS:类型错误:无法读取未定义的属性(阅读“map”)

b0zn9rqh  于 2023-01-20  发布在  其他
关注(0)|答案(1)|浏览(150)

我试图用NextJS和Strapi做一个博客。当我用getStaticProps得到帖子时,我总是在Map时得到这个错误。
这里是我的代码:

export default function Home({ posts }: { posts: any }) {
  console.log(posts);

  return (
    <>
      <Head>
        <title>Blog</title>
        <meta name="description" content="Generated by create next app" />
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <link rel="icon" href="/favicon.ico" />
      </Head>
      <main>
        {posts &&
          posts.map((post: any, i: number) => {
            return (
              <div key={i}>
                <h3>{post.attributtes.Title}</h3>
                <h5>{post.attributtes.H2}</h5>
                <p>{post.attributtes.Description}</p>
              </div>
            );
          })}
      </main>
    </>
  );
}

export async function getStaticProps() {
  const res = await axios({
    method: "get",
    url: "http://0.0.0.0:1337/api/posts",
    headers: {
      "Access-Control-Allow-Origin": "*",
      "Content-type": "application/json",
      "Access-Control-Allow-Methods": "POST, GET, PUT, DELETE, OPTIONS",
      "Access-Control-Allow-Headers": "Origin, Content-Type, X-Auth-Token",
    },
  });
  const data = res.data;

  return {
    props: {
      posts: data.data,
    },
  };
}

它给我这个错误:

Uncaught TypeError: Cannot read properties of undefined (reading 'Title')

但是当我在console.log上检查它时,它不是未定义的:

我很努力,但我不知道这里会发生什么,有人能帮忙吗?

ldioqlga

ldioqlga1#

有一个打字错误,这就是为什么该字段无法访问。

<h3>{post.attributtes.Title}</h3>
                  ^

相关问题