Я добавил этот маршрутизатор реагирования в свое приложение. Когда пользователь ищет что-то, что приложение программно перенаправляет на / search, но когда я пытаюсь переместиться назад, ничего не отображается. Я добавил начальный компонент в тэг маршрута
<Link to="/">
<MovieIcon style={{ fontSize: "48px", cursor: "pointer" }} />
</Link>
<div className={classes.grow} />
<div className={classes.search} onKeyDown={this.handleSearch}>
<div className={classes.searchIcon}>
<SearchIcon />
</div>
<InputBase
placeholder="Search…"
classes={{
root: classes.inputRoot,
input: classes.inputInput
}}
/>
</div>
handleSearch = e => {
if (e.which === 13 && e.target.value !== "") {
this.props.handleSearch(e.target.value);
this.props.history.push("/search");
}
app.js
<div className="App">
<Navbar handleSearch={this.props.searchMovie} />
<Route
exact
path="/"
render={props => {
console.log("rendering movie browser");
return <Moviebrowser {...props} topMovies={this.props.topMovies} />;
}}
/>
<Route path="/search" component={MovieSearch} />
</div>
index.js
const app = (
<Provider store={store}>
<BrowserRouter>
<App />
</BrowserRouter>
</Provider>
);
ReactDOM.render(app, document.getElementById("root"));
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>