React "?." 사용하기 Uncaught TypeError: Cannot read properties of undefined (reading 'title')

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

나를 오늘 미치게 만든 놈이다. share 라우터에서 -> ask 라우터로 이동 시에 api 요청이 빈 값으로 받아와지면서 DOM에 render를 하지 못했다.

useEffect를 도배를 했지만 결국 문제는 map을 받아올 때, ?.을 쓰는 것이었다.

{getArticle.map((article, idx) => (
              <div key={idx} onClick={() => navigate(`/product/detail/share/${article.shareListDto.id}`)}>
                <div css={thumbnailWrapper}>
                  <img src={article.shareListDto?.list[0]?.path} />
                </div>
                <div css={infoWrapper}>
                  <div>
                    <span>{article.shareListDto?.title}</span>
                    <small>1시간 전</small>
                  </div>
                  <div>
                    <small>
                      <HiLocationMarker />
                      {article?.shareListDto?.area}
                    </small>
                    <small>
                      <HiCalendar />
                      {article?.shareListDto?.startDay} ~ {article?.shareListDto?.endDay}
                    </small>
                    <small>
                      <HiHeart />
                      {article?.listCnt}
                    </small>
                  </div>
                </div>
              </div>
            ))}
          </div>