Question

React 中的 BrowserRouter 导致“无效的钩子调用”

2021-12-18

58

javascript reactjs react-hooks react-router-dom

我是新手的反应，我正在尝试使用浏览，路线和路线来设置路径。到目前为止，我的代码看起来如下

395930813

但是，浏览器页面上什么都没有出现 - 控制台输出看起来如下

错误似乎与路由器位有关，因为当我将这些行淘汰时， h1 标签中的东西似乎是打印正常。您知道如何解决此问题/可能导致的是什么？

谢谢！

Answer 1

Login 不是 <Route> 组件。 <Routes> 的所有子组件都必须是 <Route> 或 <React.Fragment> 。

尝试此操作：

import React from "react"
import "./App.css";
import { BrowserRouter as Router, Route, Routes } from 'react-router-dom';
import Login from "./Login";

function App() {

    return (
    <div className="App">
        <h1>App page</h1>
        <Router>
            <Routes>
                <Route exact path="/login" element={<Login />}/>
            </Routes>
        </Router>
    </div>
  )