Как использовать match.params.id в реагирующем маршрутизаторе v6

Ошибка: Uncaught TypeError: невозможно прочитать свойства неопределенного (чтение «путь») в matchPath (utils.ts:622:1)

useEffect(() => {
    const fetching = async () => {
      const { data } = await axios.get(`/api/notes/${match.params.id}`);

      setTitle(data.title);
      setContent(data.content);
      setCategory(data.category);
      setDate(data.updatedAt);
    };

    fetching();
  }, [match.params.id, date]);

Это поможет ?

— 19.11.2022 18:52

Если ошибка связана с чтением «пути» в утилите matchPath, почему вы спрашиваете о match.params.id? Можете ли вы отредактировать сообщение, чтобы включить полное сообщение об ошибке и сопутствующую трассировку стека кода? Более полный минимально воспроизводимый пример также был бы полезен, чтобы увидеть, что происходит с этим кодом и кодом, который, возможно, генерирует ошибку. Кроме того, будьте осторожны с использованием date в качестве зависимости, поскольку вы обновляете это состояние в эффекте.

— 22.11.2022 11:37

javascript reactjs react-router

19.11.2022 18:50

Как использовать API парсинга квитанций с помощью JavaScript за 5 минут?

В этом руководстве вы узнаете, как использовать API парсинга квитанций за 5 минут с помощью JavaScript. Eden AI предоставляет простой и удобный для...

Хук useOnClickOutside в ReactJS

Как разработчик ReactJS, вы, возможно, сталкивались с ситуацией, когда вам нужно закрыть модальное или выпадающее меню, когда кто-то щелкает за его...

Хуки (часть-2) - useEffect

Хук useEffect - один из самых мощных и универсальных инструментов в арсенале разработчика React. Он позволяет вам управлять побочными эффектами в...

Простое руководство по тестированию взаимодействия с пользователем с помощью библиотеки тестирования React

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

Как конвертировать HTML в PDF с помощью jsPDF

В этой статье мы рассмотрим, как конвертировать HTML в PDF с помощью jsPDF. Здесь мы узнаем, как конвертировать HTML в PDF с помощью javascript.

Создайте титры как в звездных войнах с помощью CSS и Javascript

Если вы веб-разработчик (или хотите им стать), то вы наверняка гик и вам нравятся "Звездные войны". А как бы вы хотели, чтобы фоном для вашего...

105

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Используйте useParams() из react-router-dom

import { useParams } from "react-router-dom";

const Component =()=>{
  const { id } = useParams();

  useEffect(() => {
    const fetching = async () => {
      const { data } = await axios.get(`/api/notes/${id}`);

      setTitle(data.title);
      setContent(data.content);
      setCategory(data.category);
      setDate(data.updatedAt);
    };

    fetching();
  }, [id, date]);
}

В вашем маршруте

<Route exact path = "/user/:id" element = {<Component />} />

Хе братан ты супер спасибо большое братан продолжай расти Тарун Бишт

— 19.11.2022 19:13

19.11.2022 18:56

Другие вопросы по теме

Отрисовано меньше хуков, чем ожидалось. Это может быть вызвано случайным ранним оператором возврата в React Hooks.

Как перенаправить пользователя в серверный компонент в Nextjs 13?

Как игнорировать пустые строки при переносе узлов с помощью SlateJS?

Чип-компонент MUI в React не отображается при первом нажатии

Необходимость методов call(), apply() и bind()

Как разрешить пользователям вручную редактировать значение метки в React?

Как сделать повторно используемый компонент TextField MUI v5 с условным украшением

В реакции 18, как мне использовать createRoot для рендеринга компонента класса?

Внутренняя ошибка сервера при использовании Multer ( node.js )

Получить размер каждого элемента, возвращаемого с помощью функции карты в React

Как использовать match.params.id в реагирующем маршрутизаторе v6

Ответы 1

Другие вопросы по теме

Похожие вопросы