Quantcast
Channel: Active questions tagged svelte - Stack Overflow
Viewing all articles
Browse latest Browse all 1541

Is it possible to annotate the type of a Svelte component?

$
0
0

I have several Svelte components, for example: Melon.svelte, Cherry.svelte, Phone.svelte. In a parent component, FruitBox.svelte, using <svelte:component>, I want to be able to dynamically render only fruit components, but not others.

Is there a way to annotate my components in some way, that would allow to semantically differentiate them?

<!-- FruitBox.svelte --> <script lang="ts">  import { onMount } from 'svelte';  import Cherry from './Cherry.svelte';  import Melon from './Melon.svelte';  import Phone from './Phone.svelte';  // can this be more specific than "any"?  let fruitType: any;  onMount(() => { fruitType = pickRandomFruit(); })  function pickRandomFruit(): any // I want type annotation / compile time check here  {    // return Phone; <-- this would also work, but I want to limit that    return (Math.random() >= 0.5) ? Melon : Cherry;   }</script><svelte:component this={fruitType} /> 

I understand Svelte doesn't have inheritance -- however, I don't need to share functionality or elements between components, but rather simple type annotation. Can this be achieved?


Viewing all articles
Browse latest Browse all 1541

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>