2016-06-23 23 views
5

Per determinare lo stile di una voce di menu specifica, sto cercando di ottenere il percorso corrente nel mio componente di navigazione.Ottenere il percorso corrente in un componente di reazione

Ho provato già alcuni dei soliti sospetti, ma non ho ottenuto alcun risultato. Soprattutto le proprietà che pensavo sarebbero state iniettate via React non ci sono.

this.props.location rendimenti undefined

this.props.context restituisce undefined

Io uso 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; 
+0

@QoP Sembra che questo sarebbe passata solo il contesto per un figlio diretto, sto Corrent? –

+1

a qualsiasi componente nella sottostruttura, http://jsfiddle.net/3yLn5qzc/11/ – QoP

+0

@AnnaMelzer è possibile condividere il codice del router per favore – Gardezi

risposta

Problemi correlati