我想访问props.location.search,因为我希望某个组件能够根据URL来获取数据,但是我不知道该如何给该组件提供prop。它位于另一个名为DashboardPage的包装器组件中,其结构如下:
class DashboardPage extends React.Component {
render() {
return (
<>
<Navigation></Navigation>
<div className="container">
<Category></Category>
<Movies></Movies>
<Footer></Footer>
</div>
</>
)
}
}
现在我的路由器设置现在看起来像这样。
<Switch>
<Redirect exact from="/" to="/discover/Popular" />
<Route
path="/discover/Popular"
component={DashboardPage}
/>
<Route
exact={true}
path="/movie/:id"
render={(props) => (
<MovieDetailPage key={props.match.params.id} {...props} />
)}
/>
<Route path="/watchlist" component={WatchlistPage}/>
<Route path="/login" component={LoginPage}/>
</Switch>
只有Dashboard获得了这些道具,因为我为此创建了一个Route,但是如何赋予Movies组件相同的访问权限。更具体地说,我的页脚组件具有一个按钮,该按钮使用Link to ='?page = 2'并更改了URL,现在,Movies组件应根据URL更改和Redux操作重新呈现。我只是不知道如何使用当前的路由器设置。