javascript / intermediate
Snippet
Komponentenreferenzen mit bind:this
Während Props der primäre Weg für die Kommunikation nach unten sind, ermöglicht 'bind:this' einem Elternteil, eine Referenz auf eine Kind-Komponenteninstanz zu erhalten. Dies ist nützlich, um Methoden aufzurufen, die vom Kind via 'export const someMethod = ...' exportiert wurden, sollte jedoch sparsam eingesetzt werden.
snippet.js
javascript
1
2
3
4
5
6
7
8
9
10
11
<script>import Child from './Child.svelte';let childInstance;function handleClick() {childInstance.externalMethod();}</script><Child bind:this={childInstance} /><button on:click={handleClick}>Call Child</button>
svelte
Erklärung
1
bind:this={childInstance}
Weist das instanziierte Komponentenobjekt der lokalen Variable 'childInstance' zu.