react-router-dom v6如何使用link进行页面跳转

v6中不再像v5中使用<Switch>等，而是使用<Routes>

App.js中：

import './App.css';
import React from 'react';
import Search from "./page/Search";
import { BrowserRouter ,Router,Routes, Link,Route} from "react-router-dom";
import Summary from './page/Summary'
import LogIn from './page/logIn'
import SearchPage from './page/Search'
function App() {
    return (
        <div className="App">
            <BrowserRouter>
                <Routes>
                    <Route path="/summary" element={<Summary />} />
                    <Route path="/" element={<LogIn />} />
                    <Route path="/search" element={< SearchPage/>} />

                </Routes>
            </BrowserRouter>

        </div>
    );
}

export default App;

Search.js中：

<Link to='/summary'>
    <Button type="primary" icon={<SearchOutlined />} onClick={submitInform}>
        Search
    </Button>

 </Link>