인프런 커뮤니티 질문&답변

저는 미리보기하면 PostRecommend.tsx부분이 아예 안뜨는데 뭐가 잘못된지 모르겠어서 질문드립니다.
(단, 화면에 정상적으로 post들은 문제없이 뜹니다.)

<PostRecommend.tsx>의 코드는 아래입니다.

"use client"
import Post from "../../_component/Post";
import { useQuery } from "@tanstack/react-query"
import { getPostRecommends } from "../_lib/getPostRecommends"
import { Post as IPost } from "@/app/model/post";

export default function PostRecommend(){
    const {data} = useQuery<IPost[]>({queryKey:['posts','recommends'],queryFn:getPostRecommends});
    return data?.map((post)=>
        <Post key={post.postId} post={post}/>
    )
}

또한 Post.tsx에서 넘겨받은 post를 console.log해봤는데

undefined가 나와 이것과 연관되어있지않나 싶어서 Post.tsx의 코드도 올리겠습니다.

import style from './post.module.css';
import Link from "next/link";
import dayjs from 'dayjs';
import relativeTime from 'dayjs/plugin/relativeTime';
import 'dayjs/locale/ko';
import ActionButtons from "@/app/(afterLogin)/_component/ActionButtons";
import PostArticle from "@/app/(afterLogin)/_component/PostArticle";
import {faker} from '@faker-js/faker';
import PostImages from "@/app/(afterLogin)/_component/PostImages";
import { Post as IPost } from '@/app/model/post';

dayjs.locale('ko');
dayjs.extend(relativeTime)

type Props = {
  noImage?: boolean,
  post:IPost,
}
export default function Post({ noImage,post }: Props) {
  const target = post;
  console.log("+++++++@@@@@@"+target);
  return (
    <PostArticle post={target}>
      <div className={style.postWrapper}>
        <div className={style.postUserSection}>
          
          <Link href={`/${target.User.id}`} className={style.postUserImage}>
            <img src={target.User.image} alt={target.User.nickname}/>
            <div className={style.postShade}/>
          </Link>
        </div>
        <div className={style.postBody}>
          <div className={style.postMeta}>
            <Link href={`/${target.User.id}`}>
              <span className={style.postUserName}>{target.User.nickname}</span>
              &nbsp;
              <span className={style.postUserId}>@{target.User.id}</span>
              &nbsp;
              ·
              &nbsp;
            </Link>
            <span className={style.postDate}>{dayjs(target.createdAt).fromNow(true)}</span>
          </div>
          <div>{target.content}</div>
          {!noImage && <div>
            <PostImages post={target} />
          </div>}
          <ActionButtons/>
        </div>
      </div>
    </PostArticle>
  )
}