面试题：React中如何配置简单的路由重定向规则

Question

在React项目中，使用React Router配置路由时，假设已有两个路由路径'/home'和'/about'，现在需要将用户访问根路径'/'时重定向到'/home'，请写出实现该重定向功能的代码片段，需包含必要的导入语句。

Answer 1

import React from 'react';
import { BrowserRouter as Router, Routes, Route, Navigate } from 'react-router-dom';

const App = () => {
  return (
    <Router>
      <Routes>
        <Route path="/" element={<Navigate to="/home" replace />} />
        <Route path="/home" element={<div>Home Page</div>} />
        <Route path="/about" element={<div>About Page</div>} />
      </Routes>
    </Router>
  );
};

export default App;