React路由器如何在路由更改时更改组件中的元素的类名称？

Question

我有以下方式路线：

<Route path="" component={Sidebar}> 
    <Route path="pages/about" component={PageFactory}" /> 
    <Route path="news" component={NewsFactory}" /> 
</Route> 

现在我想添加一个类时的路线更改侧边栏组件。所以，如果路由变成“/ pages/about”，我想要添加“is-open”className到Sidebar组件中的一个元素。如果路由变成“/”，我想远离Sidebar组件中元素的className。

我该如何做到这一点？

Answer 1

每个组件都有一些有用的属性。

在侧边栏组件，你可以这样做：

const Sidebar = React.createClass({ 
    render() { 
    let { location:{pathname, params, query} } = this.props; // router props 
    } 
}); 

然后你就可以检测是否pathname是about然后做你的is-open