# useParams

51개의 포스트
post-thumbnail

[React] react-router

react-router, Link, useParams, useNavigate

2023년 4월 14일
·
0개의 댓글
·
post-thumbnail

React-Router v.6 #2 기본

이렇게 경로에 /:id처럼 집어 넣으면 동적으로 페이지를 생성할 수 있다.그리고useParams를 통해 동적으로 받은 페이지의 내용을 출력할 수 있다.또한map과 백틱을 사용해 동적으로 n개가 들어와도 하드코딩하지 않 링크를 만들어 낼 수 있다.지금까지 해온 링크들은

2023년 4월 4일
·
0개의 댓글
·

230216 팀프로젝트 8

오늘은 params 나눠주는 것을 공부했고...! 뭔가 프로젝트하면서 params를 쓸일이 없었는데(근데 진짜 생각해보니까 뭐 제대로 해본게 없는 것같네...? 근데 안써본게 너무 많다...ㅜㅜ;;;;;;) 이번 프로젝트에서... 써봤다...ㅎㅎ param을 사용하는 이유는 간단하다 파이어스토어에 있는 post(컬렉션명)의 id 값을 받아 비교하고 그 값...

2023년 2월 16일
·
0개의 댓글
·
post-thumbnail

Browser React Router, useParams

npm i react-router-dom 리액트 라우터를 사용 할 때, 파라미터의 정보를 가져다가 쓰고 싶다면, useParams라는 훅을 사용하면 된다.useParams 우선 객체 구조분해로, const { id } = useParams()로 설정을 한 뒤,${i

2023년 2월 6일
·
0개의 댓글
·
post-thumbnail

동적 라우팅

오늘의 해결과제는 동적 라우팅을 통한 데이터 받아와서 화면에 출력하기 app.js에서 연결되는 path를 보니 목데이터를 통해서 받아오던 라우팅이 그대로 존재했다. 확인 후 변경 ![](https://velog.velcdn.com/images/seongsimk/po

2023년 1월 13일
·
0개의 댓글
·
post-thumbnail

[react] 맨날 하는 react-router-dom @v6 초기 세팅

맨날해도 맨날 헷갈리는 react-router-dom 초기 셋팅! @v6으로 제대로 해보자!

2023년 1월 9일
·
0개의 댓글
·
post-thumbnail

[React] useParams

useParams + TypeScript에서 useParams

2023년 1월 9일
·
0개의 댓글
·
post-thumbnail

[React] useLocation / useParams

일반 자바스크립트에서 url 정보를 가져오고 싶은 경우 location 인터페이스를 사용합니다.(참조) Location - Web API | MDNreact-router-dom 에서 제공하는 여러가지 Hook들은 이러한 작업을 편하게 할 수 있도록 도와줍니다. 우리가

2023년 1월 6일
·
0개의 댓글
·
post-thumbnail

React-Router-Dom v6 (hook 사용)

유튜브 클론코딩에서 사용한 useLocation, useNavigate, useParams에 대한 내용.

2023년 1월 4일
·
0개의 댓글
·

[React] 뒤로가기

리액트로 투두를 만들던 도중,뒤로가기를 할 수 없다는 사실을 깨달았다. 오매?당연히 될줄알았는데... 아니였다!! 😱어떤 동작을 해도 react-router-dom을 통해 쿼리를 설정해 놓지 않는 한은 url이 바뀌지가 않는다.흠.사실 뒤로가기를 내가 스택을 사용해서

2023년 1월 3일
·
0개의 댓글
·
post-thumbnail

[Stack Overflow] 동적 라우팅 구현

여기서 설정한 이름이 params의 key로 들어온다.\* console.log(params)상세 페이지 진입 시 API 호출 주소 : URL parameter에 접근해 데이터(question id 정보)를 받아와서 다시 사용

2023년 1월 1일
·
0개의 댓글
·
post-thumbnail

[Typescript] useParams() 타입 & undefined 에러

react-router v6 이후의 useParams의 타입 선언

2022년 12월 22일
·
0개의 댓글
·

[Today I Learned] 12월 2주차 day2

src폴더 하위에 pages폴더 생성 후 페이지별 파일 생성shared라는 폴더를 만든 후 그안에 Router.js파일을 생성App.js에 가서 Router파일 import 하기사용자가 현재 머물러있는 페이지에 대한 정보를 알려주는 hooks이다.객체 형식으로 보여주기

2022년 12월 12일
·
0개의 댓글
·
post-thumbnail

리액트 쇼핑몰 프로젝트#6

오늘 드디어 에러를 다 고쳤다.. 생각보다 순조롭게 잘 되어가는거같다

2022년 12월 10일
·
0개의 댓글
·
post-thumbnail

리액트 쇼핑몰 프로젝트#5

만족스럽게 공부끝냈다가 다시키니까 에러가떠버린상황.. 그리고 잘 기억안나는 useParams에 대한 기록

2022년 12월 9일
·
0개의 댓글
·

개념 - React Router2

Path Variable - 경로 변수, url에 있는 숫자 번호들ex) /diary/1 , /diary/2useParams로 관리QueryString - ? 키워드 뒤에있는것 가져옴ex) /edit?id=10&mode=darkuseSearchParams로 관리링크 뒤

2022년 12월 8일
·
0개의 댓글
·
post-thumbnail

[React] useParams

useParams는 RestFul API의 경로상 달라지는 부분을 추적해온다.라우터를 다음과 같이 설정해준다.그러면 detail/1, detail/2, detail/3 등등 detail뒤에오는 모든 경로상에서 Itemdetail이라는 컴포넌트가 나타난다.꼭 숫자가 아니

2022년 11월 6일
·
0개의 댓글
·

React - Movie App(2)

movie app 2

2022년 10월 21일
·
0개의 댓글
·