react-router-dom 安装

 下载

yarn add react-router-dom
或者
npm install react-router-dom

修改报错 

开始报错的代码

import React from 'react'
import { Route, BrowserRouter, Routes } from 'react-router-dom'
import Exception from '../components/Exception'
import Main from '../pages/layOut/Main'


const index = () => {
    return (
        <div>
            <BrowserRouter>
                 <Route path="/" exact element={<Main />}></Route>
                 {/* <Route element={<HomePage />} path='/' exact></Route> */}
                 <Route path="*" element={<Exception type='404' />}></Route>
            
            </BrowserRouter>
        </div>
    )
}
export default index

 修改后的代码

import React from 'react'
import { Route, BrowserRouter, Routes } from 'react-router-dom'
import Exception from '../components/Exception'
import Main from '../pages/layOut/Main'


const index = () => {
    return (
        <div>
            <BrowserRouter>
                {/* 使用/配置路由默认页；exact严格匹配 */}
                <Routes path="/" exact element={<Main />}>
                    <Route path="/" exact element={<Main />}></Route>
                    {/* <Route element={<HomePage />} path='/' exact></Route> */}
                    <Route path="*" element={<Exception type='404' />}></Route>
                </Routes>

               

            </BrowserRouter>
        </div>
    )
}
export default index

6以上的版本所有的<Route>都必须包在<Routes>里

详细连接：http://t.csdn.cn/lqDSd

注：

新版本的路由里组件使用用的是element,老的用component

//新版本
<Routes path="/" exact element={<Main />}>
//老版本
<Routes path="/" exact component={<Main />}>