[중고마켓] 타입스크립트 정리

cheolmin·2024년 1월 25일

중고마켓

목록 보기
7/7

interface IBasketEl {
  name : string;
  remarks : string;
  price : number;
  seller : {
    name : string;
 }
}


import { useRouter } from "next/router"
import * as S from "./ItemBasketList.styles"
import { IBasketEl } from "./ItemBasketList.types"

const BasketListUI : React.FC<IBasketEl> = ({el}) => {
  const router = useRouter()
  const onClickContainer = (id) => () => {
    router.push(`item/${id}`)
  }

  console.log("el",el)

  return(
    <S.Container onClick={onClickContainer(el?._id)}>
      <S.Box>
      <S.Category> 제목 : {el?.name}</S.Category>
      <S.Category> 내용 : {el?.remarks}</S.Category>
      <S.Category> 가격 : {el?.price}</S.Category>
      <S.Line></S.Line>
      <span>작성자</span>
      <S.Category> 닉네임 : {el?.seller?.name}</S.Category>
      </S.Box>
    </S.Container>

  )
}
export default BasketListUI
export default function CommentAnswerPageUI (props : CommentAnswerPageUI) {
  
  두개 이름 일치하면, 에러뜬다. 무조건 다르게
  
export interface IBoardDetailUIProps {
  data?: Pick<IQuery, "fetchBoard">;
  서버에서 받아온 data에 대한 타입은 이렇게 지정하면 된다.
  onClickMoveToBoardList: () => void;
  onClickMoveToBoardEdit: () => void;
  onClickLike: () => void;
  onClickDislike: () => void;
}
onChangeFileUrls: (fileUrls: string, index: number) => void;
데이터를 받는다면, 써줘야함
onChangeTitle: (event: ChangeEvent<HTMLInputElement>) => void;
event 속성을 쓴다면 써줘야함
onClickSubmit: () => void;
MouseEvent는 안 써줌

profile
부딪히고 생각하자

0개의 댓글