ReactJS this.props.history.push不存在！ this.props不包含歷史記錄

Question

在App.js內部，我管理路由（下圖）。 在這兩堂課我都有

import {browserHistory} from "react-router";

當我單擊圖像時，控制台顯示錯誤“無法讀取未定義的屬性'push'”。 因此，我的道具不包含歷史對象。 如何使用browserHistory重定向用戶？

////

    <Router history={browserHistory}>
    <div>
    <Route path="/profile" component={MyProfile} />
    </div
    </Router>

/// The code above is in a different class

    myprofile(props) {
        this.props.history.push('/profile');
    }

    return (
    <React.Fragment>
    <img src="../images/my-profile.png" alt="profile" className="myprofile" id="myprofile" onClick={this.myprofile.bind(this)} />
    </React.Fragment>
    );

Answer 1

如果您嘗試從路由中未定義的組件中使用this.history.push方法，也需要將所有路由器都包裝在“ BrowserRouter”組件中，而不是用“ withRouter（ComponentName）”包裝該組件。