Então, tenho trabalhado na implementação do recurso de trilhas de navegação no meu webapp sveltekit.
- A ideia é que o breadcrumb seja renderizado no topo do layout.svelte.
- E então os descendentes subsequentes, de alguma forma, passarão seus dados de navegação para o pai.
- Isso é útil quando tenho uma rota de descanso em algum lugar.
- Consegui fazer funcionar. Mas acho que pode haver uma maneira melhor de lidar com isso.
- exemplo prático -> [https://stackblitz.com/edit/sveltejs-kit-template-default-2o46jwja?file=src%2Froutes%2Ffolders%2F%5B...rest%5D%2F%2Bpage.svelte][1]
- Como você pode ver, estou fazendo isso usando vanilla js, então o armazenamento não é reativo, já que o inicializei em layout.ts. Isso significa que não será útil para armazenar dados reativos posteriormente.
Seria bom se alguém pudesse compartilhar suas experiências caso tenha encontrado algo parecido com isso.
Provavelmente, essa poderia ser uma abordagem semelhante à passagem de snippets para um layout pai:
definindo um objeto em um contexto no qual os descendentes podem gravar.
As páginas não renderizam o conteúdo diretamente, mas definem os dados de navegação e seu conteúdo (na forma de um snippet) nesse contexto. O layout pai renderiza
childrenprimeiro para obter os dados e, em seguida, renderiza o conteúdo do contexto/das migalhas de pão.Exemplos relacionados a snippets podem ser encontrados nesta resposta .
Isso é um pouco complicado, então não é o ideal. Parte dessa lógica também poderia ser extraída para componentes, mas isso provavelmente seria apenas um pouco melhor.