5. Informations de page
Toujours savoir où on se trouve
Nos liens de navigation sont fonctionnels, mais ils pourraient être encore plus utiles : ils pourraient nous informer de la page sur laquelle nous nous trouvons, en appliquant un style particulier sur le lien correspondant à la page actuelle.
Mais comment obtenir l'information de l'identité de la page actuelle ?
Le state de page
SvelteKit vous fournit cette information dans le state de page, auquel vous pouvez accéder de la manière suivante :
function a() {
console.log();
}
<!-- +layout.svelte -->
<script lang="ts">
import { page } from '$app/state';
</script>
Le state de page contient plein de choses, et notamment des informations sur l'URL courante. Le path
de la page actuelle s'obtient en écrivant page.url.pathname.
Nous verrons plus tard en détail le concept de state.
<!-- +layout.svelte -->
<script lang="ts">
import { page } from '$app/state';
</script>
<div>{page.url.pathname}</div>
Vous pouvez intégrer des calculs dans votre markup en les entourant de
{}.
Ne vous inquiétez pas si vous avez le sentiment que le code que nous écrivons actuellement n'est pas incroyable. C'est le cas. Nous l'améliorerons quand nous aurons appris plus de choses sur la syntaxe spécifique à Svelte.