[조형민] sprint5#40
Hidden character warning
Conversation
paengdal
added
매운맛🔥
seobew
left a comment
seobew
left a comment
There was a problem hiding this comment.
형민님 고생많으셨습니다.
전반적으로 잘해주셨습니다! 이것저것 많이 시도하신게 정말 좋네요 ㅎㅎ
컴포넌트 같은 경우 코멘트에도 남겨놨지만, 많이 나누다보면 저절로 감이 올것이지만
제가 PR에서 이건 나누면 좋겠습니다 라고 계속 코멘트 드릴게요!
수고하셨습니다 ㅎㅎ
| const [page, setPage] = useState(1); | ||
| const [maxPage, setMaxPage] = useState(0); | ||
| const [loadingError, setloadingError] = useState(null); | ||
| const { isTablet, isMobile } = useDeviceSize(); |
| setloadingError(null); | ||
| result = await getProducts(options); | ||
| } catch (error) { | ||
| setloadingError(error); |
There was a problem hiding this comment.
여기서 실패하면, return 해줘도 될것 같아요! result는 undefined일거라 아래쪽
const { list, totalCount } = result;실행하면 에러가 날거라서요!
There was a problem hiding this comment.
앗 그러네요! PR merge후 수정하겠습니다. 안 그러면 또 conflict… 😳
| import "./DropDown.css"; | ||
|
|
||
| export const DropDownMenu = ({ onSelect }) => { | ||
| const MENU_TEXT = ["최신순", "좋아요순"]; |
There was a problem hiding this comment.
요렇게 바꾸는게 더 좋을듯 합니다.
if textContent로 하면 좀 모호한듯합니다~
const MENU_ITEMS = [
{ text: "최신순", value: "recent" },
{ text: "좋아요순", value: "favorite" },
];
const handleClick = (value) => () => {
onSelect(value);
};
return (
<div className="dropdown-menu">
{MENU_ITEMS.map(({ text, value }) => (
<div
className="dropdown-item"
key={value}
onClick={handleClick(value)}
>
{text}
</div>
))}
</div>
);There was a problem hiding this comment.
헛..onClick에서 왜 함수 실행값을 전달하지 했더니..고차함수인가요? 이것도 나중에 더 연구해보고 적용해보겠습니다. ^^
| }; | ||
|
|
||
| const handleBlur = () => { | ||
| setTimeout(() => { |
There was a problem hiding this comment.
소스구현 찾아보다가 본거라 ㅎㅎ 감사합니다~ 😄
| display: none; | ||
| } | ||
|
|
||
| #logoM { |
There was a problem hiding this comment.
요렇게 해도 좋기는 한데, mobile이라는 class를 넣고
모바일에서 보여줘야하는 태그들에 다 붙여놓습니다.
그리고 mobile이 아니면 display none, 맞다면 display block으로 한꺼번에 처리하는 방법도 있을것 같아요~
|
|
||
| function PaginationButton({ isArrow = false, index, currentPage, onClick }) { | ||
| const handleClick = () => { | ||
| if (isArrow) { |
There was a problem hiding this comment.
페이지 컴포넌트와 화살표 컴포넌트를 분리하는게 더 좋은듯 합니다!
이렇게 분기 처리를 하게 되면 이 컴포넌트가 너무 많은 일을 하고 있는듯 해요 ㅎㅎ
아래 if 로 return 하는 것도 그렇고요!
이런것까지 컴포넌트를 나눠야하나? 를 몇번 나누다보면 더 편리해지고 어디까지 나눠야하나 감이 잡힙니다 ㅎㅎ
There was a problem hiding this comment.
ㅎㅎㅎ재사용 가능한거면 다 조건으로 만들려고 하는 강박(?)이 좀 있는 듯합니다. 😭
다음부턴 역할과 분기 처리에 대해 좀 더 고민해보고 만들어 보겠습니다!
2 participants
👉 조형민 vercel
요구사항
기본 요구사항
공통
중고마켓 페이지
심화 요구사항
공통
중고마켓 페이지
주요 변경사항
스크린샷
멘토에게