A component can change its category altogether with <svelte:component>. Instead of a sequence of if blocks...

{#if selected.color === 'red'}
	<RedThing/>
{:else if selected.color === 'green'}
	<GreenThing/>
{:else if selected.color === 'blue'}
	<BlueThing/>
{/if}

...we can have a single dynamic component:

<svelte:component this={selected.component}/>

The this value can be any component constructor, or a falsy value — if it's falsy, no component is rendered.



			
loading editor...

Console

loading Svelte compiler...


			
loading editor...

Compiler options

result = svelte.compile(source, {
generate:
});


			
loading editor...