[리액트] 함수형 리액트 이전페이지

이전페이지로 넘어가는 것을 만들고 싶었답니다...
그래서 냅다 구선생님구교수님한테 물어봤음죠!!!!!!!!!

근데 모두들 history를 쓰라고 하더라구요....?
오홍..?

import React from "react";

export default function App({ history }) {

  return (
    <div>
      <button onClick={() => history.goBack()}>이전으로 이동</button>
    </div>
  );
}

이런식으로 말이죠

근데~ 애초에 칠때부터 goBack()이라는 녀석은 뜨지도 않더라구요...^^
근데 또 back()은 있더라구요..?
그래서 저는 혼자..오홍홍 업데이트가 되었나보구나..!! 이러면서 냅다 바꿨씁니다..

import React from "react";

export default function App({ history }) {

  return (
    <div>
      <button onClick={() => history.back()}>이전으로 이동</button>
    </div>
  );
}

.
.
.
.
.

.
.
.
.
.

마음을 다 잡고 다시 찾아봅시다...^^

그래서 저는.. useHistory도 써보고 withRouter 별짓을 다해봤는데요..
똑같은 오류가 계속나더라구요.. 그래서 줸좡..어카지..
하는 순간에....찾았음미다....

useNavigate()를 사용하면 된다고 합니다!!!~~~
리액트가 v6로 업데이트 되면서 앞에 놈들이 다 사라졌다고 하네요..ㅎ

import React from "react";
import { useNavigate } from 'react-router-dom';

export default function App() {
   
  const navigate=useNavigate();
  
  return (
    <div>
      <button onClick={() => navigate(-1)}>이전으로 이동</button>
    </div>
  );
}

이렇게 하면 무진장 잘 됩니다!! 꺄하하

아 글고 원하는 페이지로 넘어가고 싶으면 navigate('원하는페이지 주소') 이렇게 작성하면 됩니다. 예를 들자면 navigate('/kkorin') 이런식으로 말입니다






오늘 깨달은점: 나는 구글링엔 재능이 없나보다.. 삽질은...나의 운명