인프런 영문 브랜드 로고
인프런 영문 브랜드 로고

인프런 커뮤니티 질문&답변

foxball님의 프로필 이미지
foxball

작성한 질문수

mongoDB 기초부터 실무까지(feat. Node.js)

Comment model 만들기

글 리스트 클릭시 상세 페이지로 넘어가는 방법에대해 꼭좀알려주세요.

작성

·

454

0

import React, { useEffect } from 'react'
import axios from 'axios'
import { useParams } from 'react-router-dom'

const ShowPage = () => {

 const {id} = useParams()

const getPost = (id) => {
    axios.get(`users/board/${id}`).then((res)=>{
          console.log(res.data);  
    })
}

useEffect(()=>{
    getPost(id);
},[])


  return (
    <div>ShowPage</div>
  )
}

export default ShowPage
    userRouter.get('/board/:userId',async(req,res)=>{
        try{
           const{userId} = req.params.userId 
        const user = await User.findOne({_id:userId});
        console.log(user);
        return res.status(200).json({success:true, user})
     
        }catch(err){
        console.log(err);
        return res.status(500).send({err: err.message})
        }
        })
        

 

답변 1

0

음 강의와 너무 상관 없는 질문이네요.

 

글 리스트에서 개별 글을 클릭을 하면 해당 상페이지로 넘어가는 구조일텐데요. 개별 글 "클릭" 하는 부분을 리엑트 라우터의 Link 태그로 감싸주시고요. 해당 링크태그에 path와 글 id를 줘서 상세페이지로 넘어가게 하면 됩니다.

 

그리고 보여주신 코드는 상세페이지로 보이는데요. useState를 추가해주시고 거기에 res.data를 저장해주시면 될듯합니다. 밑에 JSX에서는 해당 state를 받아서 랜더링을 해주도록 하고요

foxball님의 프로필 이미지
foxball

작성한 질문수

질문하기