반응형

JS 2

[React] Router 오류 (6.x.x 버전에서 바뀐 사용법)

npm install react-router-dom 평화로운 유튜브 클론코딩... 평소처럼 라우터를 이용해서 페이지를 구성하기로 마음먹고 라우팅을 했는데.. Error: A is only ever to be used as the child of element 당황스러운 오류가 떴다. Route 를 Routes 로 감싸라고 한다.. 찾아보니 Router가 버전6으로 업데이트 되면서 사용법이 바뀐모양 그래서 에러가 친절하게 설명하는대로 태그를 감싸줬다. (물론 임포트도 새로 했다) import { BrowserRouter as Router, Route, Routes } from "react-router-dom"; //... function App() { return ( ); } 근데.. Error: useR..

_/Velog 2023.12.23

[React] useState 이용하여 JS로 :hover 구현하기

호버링이란.. 말그대로 마우스를 특정 요소 위에 올렸을 때 해당 요소가 바뀌게 해주는 그런 기능? 이다 const Barogagi = styled.div` &:hover { background-color: rgb(0, 0, 0, 0.5); color: rgb(255, 255, 255, 100); } `; 이런식으로 styled-component나 css를 이용하여 호버링 기능을 쉽게 구현할 수 있지만 이제.. 이걸로는 외부의 컴포넌트를 호버할때마다 전혀 다른 컴포넌트에게 영향을 끼치게 만드는게 안되어서 속상했다 useState 를 이용한 hover 기능 구현 그러다가 알게된 onMouseOver 과 onMouseOut.. 그리하여 리액트의 useState()를 이용하여 메인함수 내부에 호버링을 구현했다!..

_/Velog 2023.12.23
반응형