反应路由器this.props.location [英] react router this.props.location

问题描述

我需要一个有关react-router v2 +
的帮助我必须在路由更改
时更改导航栏的类别，例如 route / profile className 将是profile-header
我试图在navbar组件中使用 this.props.location 但是它显示 undefined

I need a help with react-router v2+ I have to change class of navbar when route changed for example for route /profile className will be "profile-header" I tried to use this.props.location in navbar component but it shows undefined

希望你的帮助

推荐答案

您的 navbar 组件（正如您在问题中描述的那样）可能不是路由组件，对吧？通过路由组件我的意思是您在为特定路由加载的 react-router 配置中使用的那个。

Your navbar component (as you described it in your question) is probably not the route component, right? By route component I mean the one that you use in your react-router configuration that is loaded for a specific route.

this.props.location 只能在这样的路由组件上访问，所以你需要将它传递给你的导航栏。

this.props.location is accessible only on such route component, so you need to pass it down to your navbar.

我们举一个例子：

您的路由器配置：

<Router>
    <Route path="/" component={App}>
    // ...
</Router

路线组件 App ：

class App extends React.Component{
  // ...
  render() {
    return <Navbar location={this.props.location}/>
  }
}

这篇关于反应路由器this.props.location的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！