react, nextjs 경로 이동후 pathvariable 읽는법 질문

Question

// ** MUI Imports import Grid from '@mui/material/Grid' import Typography from '@mui/material/Typography' // ** Demo Components Imports import CardAppleWatch from 'src/views/cards/CardAppleWatch' import CardMembership from 'src/views/cards/CardMembership' import CardInfluencer from 'src/views/cards/CardInfluencer' import CardNavigation from 'src/views/cards/CardNavigation' import Button from '@mui/material/Button' import { useRouter } from 'next/router' import { useEffect, useState } from 'react' import axios from 'axios' const CardBasic = () => { const router = useRouter() const [postList, setPostList] = useState([]) const [idx, setIdx] = useState([]) const routeChangeStartFn = () => { console.log(idx) } const print = () => { // console.log(postList) } const getList = async (idx: string | undefined) => { const resp = (await axios.get('http://localhost:8000/ps/' + idx + '')).data setPostList(resp.data.list.content) } useEffect(() => { const i: any = router.query.idx setIdx(i) getList(i) console.log(i) router.events.on('routeChangeStart', routeChangeStartFn) return () => { router.events.off('routeChangeStart', routeChangeStartFn) } }, []) return ( `${theme.spacing(12.5)} !important` }}> 안녕하세요 정말 기초적인 질문좀 드리려 하는데react, nextjs로 기본 웹페이지 구성중에 있습니다.그런데, 문제가router.push(경로/idx)으로 경로를 이동시키면 idx값으로 서버에서 리스트를 조회해야하는데router.query.idx으로 값이 변경이 안되어서요router.push('folder/idx')수행 후에 경로값의 변경된 idx값을 정확하게 읽으려면 어떻게 수정해야할까요..?

몰랑토끼 · Accepted Answer

import { useParams } from 'next/navigation'const { id } = useParams();

react, nextjs 경로 이동후 pathvariable 읽는법 질문

1개의 답변

#pathvariable 목록