이벤트 포워딩

Inner.svelte

<script>
	import {createEventDispatcher} from 'svelte';
	
	const dispatch = createEventDispatcher();
	
	function sayHi(){
		dispatch('message', {
			text: 'Hi!'
		});
	}
</script>

<button on:click={sayHi}>
	Click to say Hi!
</button>

Outer.svelte

<script>
	import Inner from './Inner.svelte';
	import { createEventDispatcher } from 'svelte';
	
	const dispatch = createEventDispatcher();
	
	function forward(event){
		dispatch('message', event.detail);
	}
</script>

<Inner on:message={forward}/>

App.svelte

<script>
	import Outer from './Outer.svelte';

function handleMessage(event){
	alert(event.detail.text);
}

```