javascript / intermediate
Snippet
Dynamische Attribute mit Rest-Props
Das Objekt $$restProps enthält alle Eigenschaften, die an eine Komponente übergeben, aber nicht mit 'export let' deklariert wurden. Dies ermöglicht es Komponenten, Standard-HTML-Attribute dynamisch entgegenzunehmen und auf interne Elemente zu verteilen.
snippet.js
javascript
1
2
3
4
5
6
7
8
9
<!-- CustomButton.svelte --><button class="btn" {...$$restProps}><slot /></button><!-- App.svelte --><CustomButton type="submit" aria-label="Submit Form">Send</CustomButton>
svelte
Erklärung
1
{...$$restProps}
Verteilt alle zusätzlichen Attribute (wie 'type' oder 'aria-label') auf das Button-Element.
2
<slot />
Platzhalter für den Inhalt, der zwischen den Komponenten-Tags übergeben wird.