You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

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

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.07 09:50:27