Question

我正在为我的网站制作一个博客页面，该页面基于 Next.js，使用 TypeScript 编写，并使用 Strapi 作为 CMS API。

以下代码片段给了我一个 服务器错误，上面写着 TypeError: posts.map is not a function，我不知道为什么。

type BlogPageProps = {
  posts: PostData[];
};

const BlogPage = ({ posts }: BlogPageProps) => {
  useEffect(() => {
    AOS.init({ duration: 700 });
  }, []);

  return (
    <>
      <SEO title={`Blog | ${SITE_NAME}`} />

      <AnimationContainer animation="appearFromAbove">
        {posts.map((post) => (
          <PostCard effect="fade-up" key={post.id} post={post} />
        ))}
      </AnimationContainer>
    </>
  );
};

export default BlogPage;

PostData[] 只是一个包含以下参数的类型：

export type PostData = {
  id: PostID;
  title: string;
  content: string;
  slug: string;
  author: PostAuthor;
  category: PostCategory;
  created_by: PostCreatedBy;
  updated_by: PostCreatedBy;
  created_at: string;
  updated_at: string;
  cover: PostCover;
};

我认为这与 API 实例本身的代码或某些依赖问题有关？如果有人可以帮助我，我将不胜感激。谢谢。

Answer 1

首先控制台帖子并检查它是否未定义，为空，或者帖子类型必须是数组

我认为你应该尝试关注

posts.posts.map()

如何解决 var.map is not a function TypeError？

1 个答案: