Что делает useLocation, и какие данные он предоставляет?

Этот вопрос проверяет знание хука useLocation

Короткий ответ

useLocation — это хук из React Router, который возвращает объект с информацией о текущем URL. Он предоставляет такие данные, как путь (pathname), строка запроса (search) и состояние маршрута (state), если оно передано.

Длинный ответ

Хук useLocation позволяет получить доступ к текущему местоположению (location) в приложении. 

 

Возвращаемый объект имеет следующие свойства:

- pathname: Строка, представляющая текущий путь.

- search: Строка запроса (query string), например, ?sort=price.

- hash: Фрагмент URL после #, например, #section1.

- state: Дополнительные данные, переданные при навигации, например, через Link или navigate.

 

Пример использования:

import { useLocation } from 'react-router-dom';

const CurrentLocation = () => {
  const location = useLocation();

  return (
    <div>
      <p>Pathname: {location.pathname}</p>
      <p>Search: {location.search}</p>
      <p>Hash: {location.hash}</p>
      <p>State: {JSON.stringify(location.state)}</p>
    </div>
  );
};

useLocation часто используется для проверки текущего пути, отображения соответствующего контента или работы с переданными данными.

Уровень

  • Рейтинг:

    2

  • Сложность:

    4

Навыки

  • React Router

    React Router

Ключевые слова

Подпишись на React Developer в телеграм