React App Multi-Page 服务器启动时不显示任何数据？

Question

我正在尝试使用路由器-dom 通过 REACT 配置多页面设置。我设置了代码，一切运行良好。没有错误。但是，实际的应用程序根本不显示任何信息。所有代码都在这里：https://github.com/greglamm/PROJ_NEW 如果有人可以查看该应用程序，看看您是否能弄清楚是什么导致该应用程序在网站页面上不显示任何内容，我将不胜感激。所有代码都在存储库中。如果可以请帮忙！！

注意：所有主要信息都在 /mern-data/client/src 目录中。

Answer 1

mern-data/client/src/App.js 应该是在 mern-data/client/src/index.js 上呈现的组件，不是呈现某些内容的函数。尝试像这样更改 const App 函数。

const App = () => {
    return (
        <Router>
            <Navigation />
                <Routes>
                    <Route path="/" element={<Home />} />
                    <Route path="/data" element={<Data />} />
                </Routes>
            <Footer />
        </Router>
    );
};

此外，检查 package.json 文件依赖项...react-router-dom 在哪里？

"dependencies": {
    "@testing-library/jest-dom": "^5.16.4",
    "@testing-library/react": "^13.1.1",
    "@testing-library/user-event": "^13.5.0",
    "react": "^18.0.0",
    "react-dom": "^18.0.0",
    "react-scripts": "5.0.1",
    "web-vitals": "^2.1.4"
}

无论如何，如果 none 解决了您的问题，您可以分享控制台日志以获取更多详细信息吗？因为那里似乎还有一些错误或奇怪的事情

Answer 2

您的“路线”有问题

<Route path="/" element={<Home />} />
<Route path="/data" element={<Data />} />

将“元素”更改为“组件”

文档：https://v5.reactrouter.com/web/api/Route/component

React App Multi-Page 服务器启动时不显示任何数据？

React App Multi-Page Not showing any data when server is started?

reactjs

multipage