팀 상세 페이지 #66
팀 상세 페이지 #66
Conversation
|
울 웹쁜이 고생많았어 ! 여기서 미리보기로 보면서 쉬어~ 다른 웹쁜이들한테도 자랑해줘~ |
|
울 웹쁜이 고생많았어 ! 여기서 미리보기로 보면서 쉬어~ 다른 웹쁜이들한테도 자랑해줘~ |
| })(); | ||
| }, []); | ||
|
|
||
| useEffect(() => { |
There was a problem hiding this comment.
이걸 18~27번째 줄에 있는 useEffect 안에 같이 넣어주어도 될 것 같아요!!
| const names = members?.map((member, index) => ( | ||
| <span key={member.memberID}> | ||
| {member.memberName} | ||
| {index < members.length - 1 ? ',\u00a0' : ''} | ||
| </span> | ||
| )); |
There was a problem hiding this comment.
바로 컴포넌트 안에다가 해도 괜찮을 것 같아!!
return 위에 있는 친구들은 진짜 많이 호출되는데
이 부분에 console.log 찍어보면 진짜 많이 로그 찍힐거야!!
얘네는 members라는 값에만 의존하고 있는데,(===members라는 값에 따라서 변화가 있으면 되는데)
return 위에다가 쓰면은 오만가지 state변화에 다시 다 리렌더링이 될거야..!!
로그 찍히는 만큼 얘네가 계속 호출되는 건데 이 친구들이 그렇게 많이 호출되어야 하는 애들이 아니니까
바로 컴포넌트 안에 넣어줘야 좋을 것 같아!
| useEffect(() => { | ||
| (async () => { | ||
| setIsValidating(true); | ||
| const infoData = await api.teamService.getTeamInfo(teamID); |
There was a problem hiding this comment.
const { teamInfoData } = await api.teamService.getTeamInfo(teamID);이렇게 받아서 뎁쓰를 한방 줄이는건 어떨까?
굳이 teamInfoData.teamInfoData로 두 번 들어가야 할 필요는 없을 것 같아..!!
| const team = teamInfoData?.teamInfoData[Number(teamID)]; | ||
| const members = teamInfoData?.teamInfoData[Number(teamID)].teamMembers; |
There was a problem hiding this comment.
- 이 친구들도 컴포넌트 안에서 선언되는게 좋을 것 같아!!
Number(teamID)대신+teamID로 쓸 수도 있다!
| {isValidating && <div>로딩중</div>} | ||
| {team && ( | ||
| <StTeamInfo> | ||
| {team.teamImage ? <img src={team.teamImage} /> : <img src={imgEmptyProfile} />} |
There was a problem hiding this comment.
예외처리 아주 조하~~~
<img src={team.teamImage ?? imgEmptyProfile} />이렇게 src 안에서 예외처리하고 ??이라는 친구를 써보아도 좋을 것 같아!!
There was a problem hiding this comment.
src 안에서 예외 처리 하는 게 더 좋겠다 ✔
| } | ||
|
|
||
| h3 { | ||
| ${FONT_STYLES.R_13_TITLE}; |
|
울 웹쁜이 고생많았어 ! 여기서 미리보기로 보면서 쉬어~ 다른 웹쁜이들한테도 자랑해줘~ |
|
고생많았어 지연이~~~~~~~ |
|
울 웹쁜이 고생많았어 ! 여기서 미리보기로 보면서 쉬어~ 다른 웹쁜이들한테도 자랑해줘~ |
|
울 웹쁜이 고생많았어 ! 여기서 미리보기로 보면서 쉬어~ 다른 웹쁜이들한테도 자랑해줘~ |
|
울 웹쁜이 고생많았어 ! 여기서 미리보기로 보면서 쉬어~ 다른 웹쁜이들한테도 자랑해줘~ |
|
울 웹쁜이 고생많았어 ! 여기서 미리보기로 보면서 쉬어~ 다른 웹쁜이들한테도 자랑해줘~ |
| getMyIssue(): Promise<TeamIssueData>; | ||
| getTeamIssue(teamID: string): Promise<TeamIssueData>; | ||
| getTeamInfo(teamID: string): Promise<TeamInfoData>; |
| </button> | ||
| <StCheckWrapper> | ||
| <button onClick={findMyIssue}> | ||
| {isChecked ? <img src={icCoralCheck} /> : <img src={icGrayCheck} />} |
There was a problem hiding this comment.
이 친구도 src 안에서 삼항연산자 해도 괜찮을듯해!!
|
울 웹쁜이 고생많았어 ! 여기서 미리보기로 보면서 쉬어~ 다른 웹쁜이들한테도 자랑해줘~ |
⛓ Related Issues
📋 작업 내용
📌 PR Point
TeamRouter를 변경했습니다.👀 스크린샷 / GIF / 링크
https://naegasogaeseo-dev.kro.kr/team/0
https://naegasogaeseo-dev.kro.kr/team/1