2017-02-20 5 views
0

У меня есть приложение среагировать маршрутизатор, который имеет простую навигацию:Реагировать маршрутизатор сделать ссылку не активными подразделы маршрутов

React.DOM.ul(
     {className: 'navigation'}, 
     React.DOM.li(
     {}, 
     React.createElement(
      Link, 
      {to: '/', activeClassName: 'active'}, 
      React.DOM.i({className: 'fa fa-tachometer'}), 
      'Dashboard' 
     ) 
    ), 
     React.DOM.li(
     {}, 
     React.createElement(
      Link, 
      {to: '/help', activeClassName: 'active'}, 
      React.DOM.i({className: 'fa fa-life-ring'}), 
      'Help' 
     ) 
    ) 
    ) 

Когда я загружаю / Приборная панель Link активна, как можно было бы ожидать. Нажав «Справка», загрузите /help и активируйте ссылку «Справка», но также активирует ссылку «Панель мониторинга».

От всего, что я могу сказать /help по-прежнему соответствует / с Link, предполагая, что я хочу, чтобы активность отображалась на всей иерархии маршрута. Можно ли отключить это поведение?

Мой маршрутизатор:

React.createElement(Route, { 
    path: '/', 
    component: Layout 
    }, 
    React.createElement(IndexRoute, {component: Dashboard}), 
    React.createElement(Route, {path: '/help', component: Help}) 
) 

ответ

0

Если установить свойство onlyActiveOnIndex для Link в true будет активно только в случае, если текущий путь в точности соответствует ссылке пути.

Для меня это устраняет проблему, установив ее на ссылку панели управления, например.

React.createElement(
     Link, 
     {to: '/', activeClassName: 'active', onlyActiveOnIndex: true}, 
     React.DOM.i({className: 'fa fa-tachometer'}), 
     'Dashboard' 
    )