onClick시 페이지 이동을 원할경우 내가 받아온 데이터를 state로 넘겨줄 수 있다.
const navigate = useNavigate();
const handleClick = () => {
navigate(`/products/${id}`, { state: { product } });
};
내가 받아온 데이터의 이름이 product 면 state 뒤에 같은 이름인 product 로 작성한다.
넘어가는 페이지의 컴포넌트에는 받아온 값 product 를 풀어줘야하는데 방법은 useLocation을 이용해 받아올 수 있다.
const{
state:{
product:{id,image,title,description,category,price,options}
}
}= useLocation();
id, image, title, description, category ,price ,options 은 product 값들 중에서 내가 받아오고 싶은것들을 적용해준뒤 해당 컴포넌트에서 값들만 이용해서 작성하면 된다. !