Bases de Svelte
Introduction
Liaisons
Classes et styles
Svelte avancé
Réutiliser du contenu
Mouvements
Liaisons avancées
Transitions avancées
API de contexte
Éléments spéciaux
<script module>
Next steps
Bases de SvelteKit
Introduction
Routing
Chargement de données
En-têtes et cookies
Modules partagés
Formulaires
$app/state
Erreurs et redirections
SvelteKit avancé
Options de page
Options de lien
Routing avancé
Chargement avancé
Variables d’environnement
Conclusion
L’objet event passé à handle est le même objet — une instance de
RequestEvent — que celui passé aux routes
d’API dans les fichiers +server.js, aux actions de formulaires
dans les fichiers +page.server.js, et aux fonctions load dans les fichiers +page.server.js et
+layout.server.js.
Il contient des propriétés et méthodes utiles, dont certaines que nous avons déjà rencontré :
cookies— l’API cookiesfetch— l’API Fetch standard, avec des supers pouvoirsgetClientAddress()— une fonction pour récupérer l’adresse IP du clientisDataRequest—truesi le navigateur demande des données pour une page pendant une navigation côté client,falsesi une page/route est requêtée directementlocals— un endroit pour mettre des données arbitrairesparams— les paramètres de routerequest— l’objet Requestroute— un objet avec une propriétéidreprésentant la route correspondantesetHeaders(...)— une fonction pour définir les en-têtes HTTP de la réponseurl— un objet URL représentant la requête courante
Un cas d’usage classique est l’ajout de données dans event.locals via handle afin que ces
données soient lues dans les fonctions load à venir :
src/hooks.server
export async function handle({ event, resolve }) {
event.locals.answer = 42;
return await resolve(event);
}src/routes/+page.server
export function load(event) {
return {
message: `la réponse est ${event.locals.answer}`
};
}Modifier cette page sur Github
précédent suivant
1
2
3
4
5
<script>
let { data } = $props();</script>
<h1>{data.message}</h1>