反应TypeError:无法读取未定义的属性“推”

时间:2018-12-04 08:04:34

标签: reactjs

我在homePage.jsx中单击按钮时遇到此错误

  

TypeError:无法读取未定义的属性“ push”

下面是我的app.js / homePage.jsx代码

请提出建议

App.js

render() {
  return (
   <div>
     <NavBar />
     <span>
       <Router history={browserHistory}>
         <Switch>
           <Route exact path="/" component={HomePage} />
           <Route path="/contentwrapper" component={Contentwrapper} />
         </Switch>
       </Router>
     </span>
     <Footer />
   </div>
 );
} 

homePage.jsx

import React, { Component } from "react"; 
import * as FontAwesome from "react-icons/lib/fa"; 
import { authContext } from "../adalConfig";

class HomePage extends Component {   
  constructor(props) {
    super(props);
    this.handlePageChange = this.handlePageChange.bind(this);
    this.state = {};
  }   

  handlePageChange() {
    this.props.history.push("./contentwrapper");
    console.log("yes");
  }

  componentDidMount() {
    window.addEventListener("hashchange", this.handleRouteChange, false);   
  }

render() {
 return (
   <div>
     <div className="container-fluid conditionalfilters landing-page-container">
       <div className="landing-page-title-container">
         <div className="row">
           <h1>Hi {authContext.getCachedUser().profile.name}</h1>
         </div>
         <div className="row">
           <h1>Here are your dashboards. Pick one to launch.</h1>
         </div>
         <div className="row">
           <h4>You can switch between the dasboards at any time.</h4>
         </div>
       </div>
       <div className="row">
         <div className="landing-page-content-wrapper col-xs-12 col-sm-12 col-md-12 col-lg-12 p-0">
           <div className="landing-page-rectangle-box">
             <FontAwesome.FaPowerOff size={75} className="img-icon" />
             <h3>Executive</h3>
           </div>
           <div className="landing-page-rectangle-box">
             <FontAwesome.FaPowerOff size={75} className="img-icon" />
             <h3>SL Head</h3>
           </div>
           <div className="landing-page-rectangle-box">
             <FontAwesome.FaPowerOff size={75} className="img-icon" />
             <h3>SL Manager</h3>
           </div>
           <div className="landing-page-rectangle-box">
             <FontAwesome.FaPowerOff size={75} className="img-icon" />
             <h3>Account Manager</h3>
           </div>
           <div className="landing-page-rectangle-box">
             <FontAwesome.FaPowerOff size={75} className="img-icon" />
             <h3>Project Manager</h3>
           </div>
         </div>
       </div>
       <div className="row">
         <button
           className="btn btn-primary"
           type="button"
           onClick={this.handlePageChange}
         >
           View Dashboard <i className="icon-arrow-right" />
         </button>
       </div>
     </div>
   </div>
 );   
} 
} export default HomePage;

0 个答案:

没有答案