reactjs 使用React Router Dom时我的应用程序未显示在浏览器中[duplicate]

vc9ivgsu 于 2023-02-15 发布在 React

关注(0)|答案(3)|浏览(125)

- 此问题在此处已有答案**：

React Router Dom routes are returning blank pages（2个答案）
9个月前关闭。
我的主应用程序组件不显示在浏览器中，即使没有显示错误消息。请帮助

import React from 'react';
    import {BrowserRouter as Routes,Route} from 'react-router-dom';
    import MasterLayout from './layouts/admin/MasterLayout';

    function App() {
      return (
        <div className="App">
         
               <Routes>
               
               <Route path="/admin/dashboard" component = {MasterLayout} />

               
           </Routes>
         
        
        
         
    </div>
  );
}

export default App;

我不明白为什么应用程序主组件无法在我的网页上呈现。没有错误，但网页为空。请协助我。

reactjs

来源：https://stackoverflow.com/questions/72292558/my-app-does-not-display-in-the-browser-when-using-react-router-dom

3条答案

按热度按时间

klh5stk11#

import React from "react";
import { BrowserRouter as Router, Route, Routes } from "react-router-dom";
import MasterLayout from './layouts/admin/MasterLayout';

const App = () => {
  return (
    <div className="app">
      <Router>
        <Routes>
        <Route path="/admin/dashboard" element = {<MasterLayout/>} />
        </Routes>
      </Router>
    </div>
  );
};

export default App;

尝试这如果它是不工作检查你的导入的MasterLayout

赞(0）回复(0）举报 2023-02-15

goucqfw62#

看到代码，您没有显示任何主页面或基础路由器"localhost:3000/"的UI，仅显示在"localhost:3000/admin/dashboard"中

function App() {
      return (
        <div className="App">
               <Routes>
               <Route path="/admin/dashboard" component = {MasterLayout} />
           </Routes>
        </div>
     )
   }

赞(0）回复(0）举报 2023-02-15

5t7ly7z53#

在react-router-dom的版本6中，它应该是element而不是component，并且应该调用组件（<MasterLayout/>），如下所示：

import React from 'react';
import {BrowserRouter as Routes,Route} from 'react-router-dom';
import MasterLayout from './layouts/admin/MasterLayout';

function App() {
  return (
    <div className="App"> 
       <Routes> 
           <Route path="/admin/dashboard" element = {<MasterLayout/>} /> 
       </Routes>  
    </div>
  )
}

赞(0）回复(0）举报 2023-02-15

我来回答

reactjs 使用React Router Dom时我的应用程序未显示在浏览器中[duplicate]

3条答案

相关问题

热门标签

最新问答