React Router - Как добиться навигации в виде вкладок?

Я новичок в React и разрабатываю свое первое приложение с использованием React. У моего приложения был компонент вкладок с 4 вкладками, и содержимое каждой вкладки было настроено как отдельный компонент. Сейчас я заменяю вкладку 4 разными маршрутами. Итак, я избавился от вкладки и использовал реактив-маршрутизатор, чтобы настроить 4 маршрута, по одному для каждого из 4 компонентов.

В случае вкладок содержимое вкладки будет сохранять свое состояние при переходе на другую вкладку и возвращении. Например, скажем, на вкладке есть список, а пользователь прокрутил до конца списка. Если пользователь перейдет на другую вкладку и вернется, список будет прокручен вниз. Это желаемое поведение для моего приложения.

Однако я не могу добиться такого поведения с маршрутами. Я заметил, что когда я перемещаюсь от одного маршрута к другому, компоненты восстанавливаются (а не просто перерисовываются). Я могу сказать это, потому что конструктор компонента вызывается каждый раз, когда маршрут для компонента становится активным.

Я хочу добиться поведения, похожего на вкладку. Я знаю, что для Angular есть библиотека UI-Router-Extras, которая обеспечивает Deep State Redirect (для навигации в виде вкладок). Это работает очень хорошо в моем проекте Angular. Но я не могу найти подобную опцию для React. Я пробовал реагировать-маршрутизатор и реагировать-маршрутизатор-компонент, и оба повторно создать экземпляр компонента, когда его маршрут становится активным.

Есть ли решение для достижения поведения, подобного табуляции для маршрутов в React?

Ответы на вопрос(2)

Ваш ответ на вопрос