Eu sou novo no React e desenvolvo meu primeiro aplicativo usando o React. Meu aplicativo tinha um componente de guia com 4 guias e o conteúdo de cada guia foi configurado como um componente separado. Agora estou substituindo a guia por 4 rotas diferentes. Então, me livrei da guia e usei o react-router para configurar 4 rotas, uma para cada um dos 4 componentes.

Com guias, o conteúdo de uma guia manteria seu estado ao navegar para uma guia diferente e voltar. Por exemplo, digamos que a guia tenha uma lista e o usuário tenha rolado até o final da lista. Se o usuário navegar para uma guia diferente e voltar, a lista permanecerá rolada para baixo. Esse é o comportamento desejado para o meu aplicativo.

No entanto, não consigo atingir esse comportamento com rotas. Percebi que quando navego de uma rota para outra, os componentes são re-instanciados (não apenas re-renderizados). Eu posso dizer isso porque o construtor do componente é chamado toda vez que a rota do componente se torna ativa.

Eu quero alcançar o comportamento de tabulação. Sei que, para o Angular, existe uma biblioteca UI-Router-Extras que fornece redirecionamento de estado profundo (para navegação em forma de guia). Funciona muito bem no meu projeto Angular. Mas não consigo encontrar uma opção semelhante para o React. Tentei reagir-roteador e reagir-roteador-componente e ambos re-instanciar um componente quando sua rota se tornar ativa.

Existe uma solução para obter um comportamento de tabulação para as rotas no React?