React-маршрутизатор onChange hook

у меня возникли проблемы с получением крючка onChange в react-router для правильной работы. Вот мой файл маршрутов:

import React from 'react';
import { Router, Route, browserHistory } from 'react-router';
import TestOne from './Pages/testone';
import TestTwo from './Pages/testtwo';

function logUpdate() {
    console.log('Current URL: ' + window.location.pathname);
}

const Routes = (
    <Router history={browserHistory}>
        {/* App Routes */}
        <Route path="/" component={App} lang={lang}>
            <Route path="/testone" component={TestOne} onUpdate={logUpdate} />
            <Route path="/testtwo" component={TestTwo} onUpdate={logUpdate} />
        </Route>
    </Router>);

export default Routes;

Я понимаю, что функция logUpdate будет запускаться при каждом изменении состояния. Однако он запускается только при перезагрузке соответствующей страницы через F5.

мое меню использует простые ссылки, например:

<div>
<Link to="/testone">Test One</Link>
<Link to="/testtwo">Test Two</Link>
</div>

что я делаю не так?

10
javascript react-router reactjs

2 ответов

onUpdate необходимо объявить на Router не Routes. Хотя,Routes может объявить onChange и onEnter крючки-это, вероятно, то, что вы искали.

5

Я использую react-router ^2.4.0, и onUpdate не работал для меня. Вместо этого я использовал onChange в своем базовом компоненте маршрута.

const Routes = (
    <Router history={browserHistory}>
        {/* App Routes */}
        <Route path="/" component={App} lang={lang} onChange={logUpdate}>
            <Route path="/testone" component={TestOne} />
            <Route path="/testtwo" component={TestTwo} />
        </Route>
    </Router>);
0