Javascript 导航问题：this.props历史记录似乎未定义

我无法转到其他页面，因为

this.props.history

似乎未定义。下面是我看到的错误截图。请注意，我使用登录组件中的

this.props.history.push（“/welcome”）

呈现了欢迎组件，它当时运行良好

这是我的App.js

import React from "react";
import { BrowserRouter as Router, Route } from "react-router-dom";
import Login from "./Components/Login";
import "./App.css";
import Signup from "./Components/Signup";
import Welcome from "./Components/Welcome";
import RecruiterPage from "./Components/Common/RecriterPage";


function App() {
  return (
    <Router>
      <div className="App">
        <Route exact path="/signup" component={Signup} />
        <Route exact path="/" component={Login} />
        <Route exact path="/welcome" component={Welcome} />
        <Route exact path="/recruiter" component={RecruiterPage} />
      </div>
    </Router>
  );
}

export default App;

从“React”导入React；
从“react Router dom”导入{BrowserRouter as Router，Route}；
从“/Components/Login”导入登录名；
导入“/App.css”；
从“/Components/Signup”导入注册；
从“/Components/Welcome”导入欢迎信息；
从“/Components/Common/RecriterPage”导入招聘页面；
函数App（）{
返回(
);
}
导出默认应用程序；

我的最佳猜测是，您尝试从中导航的组件是父组件的子组件，该父组件可能有权访问历史记录，也可能没有权访问历史记录道具

有两种方法可以解决此问题： 1.将历史作为道具从父组件传递给子组件或 2.在所述部件上执行此操作：

import { withRouter } from 'react-router-dom'

…导出组件时，请使用Router将其封装，例如

export default withRouter(ComponentName)

---

我希望这有助于回答你的问题吗？因为“App”类的划分（我的意思是），你们打破了路由器和它的路由之间的链条。因此，删除此分区，历史记录将再次可用。@Sercanözen我刚在

之前移动了我的

，但问题仍然存在。@ZombieChowder我遗漏了一些东西，可能是因为我尝试了您在第二条评论中提到的解决方案是的，在这种情况下，它将出现在ModalButton.js上