2022/01/26

Dropdown 자바스크립트 없이 만들기(React)

웹사이트를 만들다 보면 드롭다운을 만들일이 많이 있습니다. 네비게이션에 메뉴라던지 필터등 여러가지에 사용이 됩니다. 예전에 드롭다운을 만들때 리액트로 state을 써서 만든 경우가 많이 있었습니다. CSS를 잘 못했던 이유도 있었고 복잡한 경우도 많았기 때문입니다. 최근들어 다시 CSS를 공부하다가 배웠는데 dropdown을 만들 때 그냥 간단한 input과 label만 있으면 되는 것이였습니다. 이번 예제는 리액트를 사용하는데 사실 대부분이 그냥 HTML과 CSS이기 때문에 크게 걱정할 필요는 없습니다. 따라하고 싶으신 분은 맨 끝에 남겨 놓도록 하겠습니다. dropdown css로 만들기 원리 Label과 input은 id와 for로 연결 될 수 있습니다. 그렇게 연결 됐을 때에 label을 클릭하면..