https://github.com/TEAM-DAWM/NUTSHELL-FE/pull/293
[FEAT] 공통 컴포넌트 컨트롤버튼 퍼블리싱 by wrryu09 · Pull Request #293 · TEAM-DAWM/NUTSHELL-FE
작업 내용 🧑💻 컨트롤 칸에 있던 공컴을 만들었습니다 shadow 테마를 추가했습니다 폴더를 button 하고 control 로 나눴습니다 알게된 점 🚀 기록하며 개발하기! 여기에서 Button 컴포넌트를 사용
github.com
- 여기에서 Button 컴포넌트를 사용하는데, Button은 width 가 따로 지정되어 있지 않고 flex 로 설정되어 있어 완료버튼 혼자 사이즈가 달라 설정해주어야 했습니다. + 눌렸을 때 shadow 도 줘야 해서..
- styled(Button) 처럼 작성하려고 했는데 Button자체는 styled 를 사용한 컴포넌트를 사용하지만.. 리턴하는 건 react component이기 때문에 추가 css가 올라가지 않았습니다. (이거때매 styled 구문을 함수 외부로 빼서 props 처리도 해봤는데 되진 않았습니다)
- 그래서 Button의 css를 달리해서 사용할 경우도 많을 것 같아.. additionalCss props를 뚫어서 styled 컴포넌트 마지막 부분에 변수를 넣어주어 기존 css 를 덮어써 적용되도록 만들었습니다.
- 해당 방법보다 좋은 방법 있으면 알려주시면 적용할게요!!!!!
ㄴ 별걸 다 해봤는데 ref를 쓰는 건 너무 복잡해질 것 같고 다양한 곳에서 써야 해서 css 선에서 마무리하고 싶었다좋은 방식을 추천해줬으면 좋겠당
'Dev > React' 카테고리의 다른 글
| useTheme vs theme import (1) | 2024.11.18 |
|---|---|
| 공통 컴포넌트 아이콘버튼 만들기 (0) | 2024.11.17 |
| Next.js 라우팅 (8) | 2024.05.08 |