React组件无法显示求助:新手搭建登录页面无内容输出
问题原因及解决方案
你的代码页面空白是因为React Router v6的路由配置语法错误,具体问题和修复方式如下:
错误点
- React Router v6 不再允许将组件作为
<Route>的子元素传入,必须通过element属性指定要渲染的组件 - v6 中
<Route>默认就是精准匹配,exact属性已被移除,无需添加
修正后的App.js代码
import { BrowserRouter as Router, Routes, Route } from "react-router-dom"; import './App.css'; import Login from './Login.js'; function App() { return ( <div className="App"> <Router> <Routes> <Route path='/' element={<Login />} /> </Routes> </Router> </div> ); } export default App;
修改后重新执行 yarn start,页面就能正常显示"Login"内容了。
内容的提问来源于stack exchange,提问作者jingyan
相关产品推荐
相关产品推荐

