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 内存变量 / 刷新返回首页的应用

 

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



猜您在找 react route 路由改变,页面不刷新的问题 :only-child和:only-of-type选择器的比较 [vue-router] Named Route 'Home' has a default child route. The .native modifier for v-on is only valid on components but it was used on android 异常:ScrollView can host only one direct child 解决Zabbix网页端Get value error: cannot connect to [[192.168.238.139]:10050]: [113] No route to host问题 create-react-app 遇到问题 TypeError: Cannot assign to read only property 'jsx' of object '#' error: incomplete type ‘’ used in nested name specifier Bug--Tomcat Error start child 故障:ERROR:ERROR: child process failed, exited with error number 51
 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM