Comprendre les Slots par Défaut dans Svelte
Apprenez à utiliser les slots par défaut dans un composant enfant Svelte pour afficher le contenu non nommé.
Introduction et premiers pas







La syntaxe de base de Svelte










Conditions, boucles et gestion événementielle







Les composants






Slots et Lifecycle hooks










Gestion des formulaires







Les stores de Svelte








Animations et transitions







Une application SPA avec Svelte
SvelteKit











Détails de la leçon
Description de la leçon
Lors de l'invocation d'un composant, le contenu de son innerHTML qui n'est pas nommé est automatiquement considéré comme le slot par défaut. Dans le composant enfant, il suffit d'utiliser une balise slot
pour le représenter. Nous reprendrons le code précédent du composant app.svelte
, en y intégrant un slot nommé et un contenu non nommé. La balise slot
a été utilisée pour représenter le slot par défaut. Exécutez le code pour observer comment le contenu non nommé est placé dans ce slot par défaut. Dans la prochaine section, nous aborderons la façon d'afficher conditionnellement des slots.
Objectifs de cette leçon
Comprendre et implémenter les slots par défaut dans les composants Svelte pour une meilleure gestion du contenu dynamique.
Prérequis pour cette leçon
Connaissances de base en JavaScript et Svelte.
Métiers concernés
Développeur Front-End, Ingénieur en développement logiciel, Architecte logiciel.
Alternatives et ressources
Utilisation des composants enfants sans slots ou utilisation des frameworks alternatifs comme Vue.js.
Questions & Réponses
slot
qui représente tout contenu non nommé passé au composant enfant.
slot
sans attribut de nom dans le composant enfant.
