드롭다운2 반응형 드롭다운 사용 라이브러리: react, react-hook, styled-component 2021. 11. 14. 드롭다운 버튼과 리스트의 크기를 반응형으로 구현하기 드롭 다운 리스트를 구현 1. 상단부의 드롭 다운 선택버튼과 드롭 다운 리스트를 다른 컴포넌트로 분리 2. 상단부의 선택버튼은 반응형으로 크기에 따라 변하지만 하단부의 리스트는 반응형으로 크기가 변하지 않음 해결책 1 드롭 다운 리스트 CSS 수정 width: inherit; > 선택버튼과 리스트가 상속관계에 있지 않으면 사용 불가능 해결책 2 선택 버튼을 클릭하면 리스트의 Props에 자신의 width 값을 전달하고 리스트는 그 props의 width값으로 자신의 넓이를 설정 해결책 2-1 선택 버튼에 onClick={clickHandler} 부착 event.target 으로 클릭한 객체를 선택 > 이벤트가 발생한 객체를 선택 event.currentTarget > 이벤트 핸들러가 부착된 객체를 선택 .. 2021. 10. 24. 이전 1 다음
