React 도와주십쇼 ...!

Question

특정 버튼을 클릭했을때 하나의 모달창으로 url에 따른 데이터를 가져와서 뭔갈 할려고 합니다예들들어서 url이 /product/date 라고 한다면 firebase에 date라는 문서를 가져와서 모달창에서 담겨있는 문서 정보를 랜더링 해주려고 합니다이 기능이름이 뭔지도 모르겠고 ... 찾아봐도 암만 안 나와서 질문드립니다 !!이런 걸 뭐라 부르는지 알려주시기라도 하면 감사하겠습니다 !제가 글을 너무 잘못쓴 거 같아 추가로 덧붙입니다 !특정 url을 들어감과 동시에 어떻게 Modal창을 띄우줄지입니다데이터를 가져오는 함수를 만들고 useEffect안에 넣어서 사용하면 모달을 열지 않아도 함수가 실행이 됩니다 한마디로 /product/date 까지 안 가도 /product에서 함수가 실행이 되서 원하는 결과값이 나오지 않습니다 !

초보개발자임니다 · Answer

Rest Api 말씀하시는 걸까요?

코딩하는 두루미 · Answer

URLSearchParams

초밥먹고싶다 · Answer

/product/:id id값에따라 백앤드에서 데이터 보내주면 되지않나요?

누렁렁이 · Answer

라우터를 어떻게 쓰시고 계신지는 모르지만 /product/:id에서만 실행되는 컴포넌트 또는 Outlet을 만들어서 거기서 처리하도록하면 될 것 같습니다.아니면 /product에서는 useParams로 가져왔을 때 id가 undefined일 것이기 때문에 조건문으로 처리해도 될 것 같구요

풍월상신(가니메디안) · Answer

NextJS 에서 Parallel Route 라는 기능으로 원하시는 작업을 구현할 수 있습니다.패럴렐 라우트는 Dom 의 일부 요소에 또다른 URL 을 띄워줄 수 있고,Dialog 에 띄워줄 수도 있습니다.

RWB · Answer

Next.js에 Dynamic Route라는 기능이 있습니다.app/product/[id]/page.tsx위와 같이 파일을 만들면, /product/{id}와 같은 형식으로 페이지가 생성됩니다.코드 상에서 id에 매핑된 값을 토대로, 원하는 동작을 수행할 수 있습니다.export default function Page({ params }): JSX.Element { return

{params.id}

}

ㅇㅇ(192.168) · Answer

사실 잘 작동하는 코드였습니다 ... 진짜 초보적인 실수로 코드가 동작하지 않았던 거였습니다 ... 죄송합니다 ㅠㅠ....

React 도와주십쇼 ...!

7개의 답변

기술 목록