Как я могу получить доступ к текущему местоположению хэша в ответном маршрутизаторе 2?

Question

Я хочу получить доступ к текущему пути местоположения (например,/home) без ключей истории для некоторой логики сравнения.

Как я получить доступ к нему из hashHistory в реакции маршрутизатор 2.

Кроме того, как я могу получить доступ к предыдущему пути?

Answer 1

Вы можете получить текущий путь от опоры location вашего компонента маршрута.

Доступ к местоположению из этого.props.location вашего компонента маршрута. Если вы хотите получить его глубже в дереве, вы можете использовать любые условные обозначения, которые имеет ваше приложение для получения реквизита с максимума вниз. Один вариант заключается в обеспечении его на условиях самостоятельно:

// v2.0.x константные RouteComponent = React.createClass ({
childContextTypes: { местоположение: React.PropTypes.object},

getChildContext() { возвращение {местоположение: this.props.location}}})

Посмотрите here.

Чтобы получить текущий путь, вы можете использовать только location.pathname.

Answer 2

Один из способов доступа к пути через this.props.location от реагирующего компонента.

import React from 'react' 
import { render } from 'react-dom' 
import { browserHistory, Router, Route, Link } from 'react-router' 

class Child extends React.Component { 
    render() { 
    let location = this.props.location 
    return (
     <div> 
     <h1>Child Component</h1> 
     <p>{location.pathname}</p> 
     </div> 
    ) 
    } 
} 

class App extends React.Component { 
    render() { 
    return (
     <div> 
      {this.props.children} 
     </div> 
    ) 
    } 
} 

render((
    <Router history={browserHistory}> 
    <Route path="/" component={App}> 
     <Route path="child" component={Child} /> 
    </Route> 
    </Router> 
), document.getElementById('example')) 

Другой способ, если вы хотите слушать изменения в текущем местоположении через историю -

import { createHistory } from 'history' 

let history = createHistory() 

// Listen for changes to the current location. The 
// listener is called once immediately. 
let unlisten = history.listen(function (location) { 
    console.log(location.pathname) 
}) 

// When you're finished, stop the listener. 
unlisten()