React 18中使用react-router-dom的exact属性报错，求精确路由方案

问题原因 #

你使用的是**React Router Dom v6+**版本，该版本已经移除了exact属性——现在Route组件默认就是精确匹配路径的，所以原代码中的exact属性属于无效属性，触发了类型校验报错。

修改后的代码 #

直接移除所有exact属性，同时注意v6版本对Route组件的使用要求：必须用Routes组件包裹，且页面组件通过element属性传递，代码如下：

import { BrowserRouter, Route, Routes } from 'react-router-dom'; // 需导入Routes组件
import Landing from './pages/Landing'
import FanbaseMap from './pages/FanbaseMap'

function AppRoutes() {
  return (
    <BrowserRouter>
      <Routes>
        <Route path="/" element={<Landing />} />
        <Route path="/map" element={<FanbaseMap />} />
      </Routes>
    </BrowserRouter>
  );
}

补充说明 #

• React Router Dom v6 中，Route不再通过children传递页面组件，统一使用element属性
• 所有Route必须被Routes组件包裹，这是v6的强制规则
• 若需要模糊匹配（如嵌套路由场景），可使用*通配符，例如path="/users/*"

内容的提问来源于stack exchange，提问作者Belmont