时间戳

首页 > 解决方案 > 简单的反应路线没有出现

reactjs - 简单的反应路线没有出现

问题描述

我正在关注一个关于反应路线的非常简单的教程，由于某种原因，这个代码块不会在屏幕上呈现组件。这是我在App.js中的代码：

import React from "react";
import "./App.css";
import { BrowserRouter as Router, Route } from "react-router-dom";
import SigninPage from "./pages/signin";

function App() {
  return (
    <Router>
      <div>
        <Route path="/" component={SigninPage} exact />
      </div>
    </Router>
  );
}

export default App;

如果我替换<Route path="/" component={SigninPage} exact />为<SigninPage />，则显示该组件。

我没有警告或错误，我的react-router-dom版本是6.0.0-beta.0. 我已尝试npm start再次运行并重新启动计算机。我非常感谢任何帮助。

编辑：

我认为包含signin.js会很有用：

import React from "react";

const SigninPage = () => {
  return (
    <div>
      <h1>Signin</h1>
    </div>
  );
};

export default SigninPage;

标签： reactjsreact-routerreact-router-dom

解决方案

这里的react-router-dom版本似乎不正确，API 在 V6 中略有变化，所以如果您尝试稳定版本，一切都会正常工作。

您可以将版本更改为@latest指向稳定版本或安装特定版本的版本。

npm i packageName@versionNumber

npm uninstall react-router-dom
npm install react-router-dom@latest or npm install react-router-dom@5.2

推荐阅读