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

Svelte typescript safe components

$
0
0

I am trying to take components and its types, put it to single variable and then use it on page.

import { Container_01 } from './components/containers';import { Footer_01 } from './components/footers';import type { Container01 } from '$types/containers/Container_01';import type { Footer01 } from '$types/footers/Footer_01';type UIKitType = {    containers: {        Container_01: Container01,    };    footers: {        Footer_01: Footer01    }}const UIKit = {    containers: {        Container_01: Container_01    },    footers: {        Footer_01: Footer_01    }}type ComponentTypes = {    [K in keyof UIKitType]: {        [L in keyof UIKitType[K]]:{            type: K,            component: L,            props: UIKitType[K][L]        }    }[keyof UIKitType[K]]}[keyof UIKitType]

Then when i use it in svelte page:

{@const type = "containers"}{@const component = "Container_01"}<svelte:component    this={UIKit[pepaType][pepaComp]}    props={data.props}></svelte:component>

I got typescript error: Element implicitly has an 'any' type because expression of type 'any' can't be used to index type

I have no idea, how to solve it. Only thing i now its working without ts error is to use [key: string]: UIComponent;.


Viewing all articles
Browse latest Browse all 1541

Trending Articles



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