오늘 배운것

  1. recoil을 사용해서 wholepage 모달을 눌렀을때, 탭이 바뀌게 구현

  2. text 넘칠때 … 표시

h1 {
    flex-grow: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

white-space : nowrap 속성에 대하여

CSS / white-space / 공백 처리 방법 정하는 속성

nowrap은 줄바꿈이 일어나지 않도록 설정하는것.

  1. props를 왜 비구조 할당으로 넘겨야하는건지???… ( 타입스크립트 )
function InquiryRead() {
  return (
    <InquiryReadWrapper>
      {datas?.map((data) => (
        <InquiryPost key={data.id} **{...data}** />
      ))}
    </InquiryReadWrapper>
  );
}
  1. useNavigate를 사용하기 위해서는 Router 컴포넌트 안에 위치해야한다. 그리고 <Routes> 컴포넌트 안에서는 무조건 라우트 시킬 페이지를 element로 넣어줘야한다.
    1. Gnb를 navigate(-)를 쓰기위해 Router 컴포넌트 안으로 옮겨넣고, 따로 element로 넘길게 없으므로 <Routes> 밖으로 빼야한다.
function Router() {
  return (
    <>
      <Gnb />
      <Routes>
        <Route path="/" element={<Inquiry />} />
        <Route path="/about/:postId" element={<InquiryDetail />} />
      </Routes>
    </>
  );
}
  1. script파일을 불러올때는 절대경로로 못불러온다… 하지만 이미지, svg, 다른 파일은 절대경로로 불러와진다.
  2. 모달들을 각각의 컴포넌트에서 띄울게 아니고, 중앙에서 띄우는게 맞을 것같다.