[React] Router replace to

import React from "react";
import { Routes, Route, Link, Navigate } from "react-router-dom";
import Home from "./pages/Home";
import Login from "./pages/Login";

function NoMatch() {
  return (
    <div>
      <h2>페이지를 찾을 수 없습니다.</h2>
      <p>
        <Link to="/">홈으로</Link>
      </p>
    </div>
  );
}
function Router() {
  return (
    <Routes>
      <Route path="/login" exact={true} element={<Login />} />
      <Route path="/" element={<Navigate replace to="/login" />} />
      <Route path="/home" exact={true} element={<Home />} />
      <Route path="*" element={<NoMatch />} />
    </Routes>
  );
}

export default Router;

 

1. '/' 로 들어왔을때 '/login' 으로 자동이동함.

2. 없는 링크로 접근하는 경우 NoMatch 를 리턴함.