NavLink onActive обратный вызов - PullRequest
Новая
       7

NavLink onActive обратный вызов

0 голосов
/ 19 мая 2018

Есть ли способ узнать, когда NavLink активен?как то так?

1003 *

1 Ответ

0 голосов
/ 13 августа 2018

Вы можете использовать обратный вызов NavLink isActive для достижения этой цели.isActive позволяет определить собственное поведение, когда ссылка активна;он получает match и ваш текущий location объект.Вы можете изменить его так, чтобы он принимал обратный вызов, который будет срабатывать, если совпадение истинно.Вот простой пример: 

const isActive = onActive => (match, location) => {
  if (match) {
    onActive();
  }
  return match;
}

const App = () => {
  const onActive = () => console.log("link is active");
  return (
    <BrowserRouter>
      <div>
        <NavLink to="/abc" activeClassName="active" isActive={isActive(onActive)}>Go To ABC</NavLink>
        <Route path="/abc" render={() => <h1>ABC Page</h1>} />
      </div>
    </BrowserRouter>
  );
}
...