Reactjs 使用材质搜索栏导航到其他页面

我正在我的应用程序标题中使用材料搜索栏，并尝试导航到localhost onRequestSearch上的“/search”页面。搜索栏本身的代码很简单：

 <SearchBar
   onChange = {() => console.log('onChange')}
   onRequestSearch = {() => this.setRedirect()}
   style = {{ margin: '0 auto', maxWidth:800}}/>

但这会产生一个错误，即未定义的对象不是评估this.props.history的对象。在我的主应用程序中，我确实为/搜索页面设置了路线。 我还尝试使用重定向：

constructor(props) {
  super(props);
  this.state = {
     redirect = false
    }
}

setRedirect()  {
  this.setState({
    redirect: true  
  }
}

在渲染方法中：

render() {
  if(this.state.redirect)  {
    return (
        <Router>
          <div>
            <Redirect push to="/search"/>
            <Route path="/search" exact strict component={Search}/>
          </div>
        </Router>
    );
   }
  else {
   // return other stuff
 }
}      

这只会导致当我在搜索栏中键入内容并按enter键时，整个页面变为空白。浏览器中的地址也不会更改为“/search”。

---

不知道我做错了什么。当用户在搜索栏中输入文本并点击enter键时，只需尝试导航到另一个页面。如有任何建议，将不胜感激。提前谢谢你

尝试使用路由器HoC添加，然后使用this.props.history.push重试

import {  withRouter } from 'react-router-dom'
...
export default withRouter(MyComponent);

---

赢家非常感谢您，先生！我将在允许的最早时间3分钟内接受你的答复。再次感谢你！此外，您还可以避免HoC仅从包含此道具的最新组件中传递历史道具。@Joãovitor我正在尝试做同样的事情。您知道如何通过onRequestSearch将输入值传递给搜索组件吗？

import {  withRouter } from 'react-router-dom'
...
export default withRouter(MyComponent);