Geçerli yolu bir tepki bileşeninde alın

Question

Belirli menü öğelerinin stilini belirlemek için, Gezinme bileşenimde geçerli yolu bulmaya çalışıyorum.

Zaten bazı şüphelileri denedim, ancak sonuç alamıyorum. Özellikle React üzerinden enjekte edileceğini düşündüğüm özellikler orada değil.

this.props.location döner undefined

this.props.context döner kullandığım undefined

react 15, redux 3.5, react-router 2, react-router-redux 4

import React, {Component, PropTypes} from 'react'; 
import styles from './Navigation.css'; 
import NavigationItem from './NavigationItem'; 

class Navigation extends Component { 

    constructor(props) { 
    super(props); 
    } 

    getNavigationClasses() { 
    let {navigationOpen, showNavigation} = this.props.layout; 
    let navigationClasses = navigationOpen ? styles.navigation + ' ' + styles.open : styles.navigation; 
    if (showNavigation) { 
     navigationClasses = navigationClasses + ' ' + styles.collapsed; 
    } 
    return navigationClasses; 
    } 

    render() { 
    /* 
    TODO: get pathname for active marker 
    */ 

    let navigationClasses = this.getNavigationClasses(); 
    return (
     <div 
     className={navigationClasses} 
     onClick={this.props.onToggleNavigation} 
     > 

     {/* Timeline */} 
     <NavigationItem 
      linkTo='/timeline' 
      className={styles.navigationItem + ' ' + styles.timeline} 
      displayText='Timeline' 
      iconType='timeline' 
     /> 

     {/* Contacts */} 
     <NavigationItem 
      linkTo='/contacts' 
      className={styles.navigationItem + ' ' + styles.contact + ' ' + styles.active} 
      displayText='Contacts' 
      iconType='contacts' 
     /> 

     </div> 
    ); 
    } 
} 

Navigation.propTypes = { 
    layout: PropTypes.object, 
    className: PropTypes.string, 
    onToggleNavigation: PropTypes.func 
}; 

export default Navigation; 

Answer 1

yönlendirici sizin bileşenini ekleyin ilk

<Router path="/" component={Navigation} /> 

Sen

this.props.location.pathname 

Sadece doğrudan çocuğa bağlam geçerdi bu gibi görünüyor @QoP Bu, konum

https://github.com/ReactTraining/react-router/blob/master/packages/react-router/docs/api/location.md