TIL) 라우팅: useHistory 로 뒤로가기 버튼 만들기

1. NotFound.js에서 useHistory 먼저 가져오기

import { useHistory } from "react-router-dom";

2. 버튼 만들어주기

import React from "react";
import { useHistory } from "react-router-dom";

const NotFound = (props) => {
  return (
    <div>
      <h1>주소가 올바르지 않아요!</h1>
      <button>뒤로가기</button>
    </div>
  );
};

export default NotFound;

3. useHistory로 뒤로가기 만들기!

import React from "react";
import { useHistory } from "react-router-dom";

const NotFound = (props) => {
  let history = useHistory();
  return (
    <div>
      <h1>주소가 올바르지 않아요!</h1>
      <button
        onClick={() => {
          history.goBack();
        }}
      >
        뒤로가기
      </button>
    </div>
  );
};

export default NotFound;