react問題錄-4 Error: A ＜Route＞ is only ever to be used as the child of ＜Routes＞

問題1:關於react-router-dom 6.0.1的基礎寫法 解決Error: A ＜Route＞ is only ever to be used as the child of ＜Routes＞

Route 需要在 Routes 里，組件為 element,注意括號內為標簽

// import logo from './logo.svg';
import './App.css';
import { Route, Link, Routes } from 'react-router-dom';
// 導入對應組件
import Home from './View/Home';
import About from './View/About';

function App() {
    return (
        <div className="App">
            <Link to="/">首頁</Link>
            <Link to="/about">關於我們</Link>
            <Routes>
                <Route path="/" component={Home} />
                <Route path="/about" component={About} />
            </Routes>
        </div>
    );
}

export default App; 

問題2:Matched leaf route at location "/" does not have an element. This means it will render an <Outlet /> with a null value by default resulting in an "empty" page.

 轉載自：https://www.cnblogs.com/cqkjxxxx/p/15600845.html 

路由	原理	地址	應用場景
BrowserRouter	HTML5 history API	/news	HTML5 兼容瀏覽器，可以配合服務器（刷新時）
HashRouter	Location.hash	/#/news	無法兼容 HTML5 的瀏覽器，服務器無法收到 # 后面的數據
MemoryRouter	內存變量	/	刷新返回首頁的應用