vue.js - Hur man får en komponenttyp så att jag kan använda den i ett TypeScript-gränssnitt - Vue 3


Jag försöker bara sätta upp en matris av komponenter så att jag kan göra något dynamiskt komponentbyte senare. Men jag sitter fast med att få Typescript att fungera med det och oavsett hur jag frågar frågan online handlar alla tidigare svar om helt andra saker.

Jag har tillhandahållit en skärmdump av vad jag vill göra. Jag vill kunna skriva ett TypeScript-gränssnitt och ge det en typ som motsvarar vilken Vue-komponent som helst som jag skickar. Det behöver bara säkerställa att det är en Vue-komponent som skickas, jag bryr mig inte om vilken komponent det är. Jag behöver i princip en typdefinition för en Vue-komponent. Hur gör jag det?

Svar #1

Component är faktiskt rätt typ, som du har försökt, men du behöver importera den innan användning:

<script setup lang="ts">
import type { Component } from 'vue'
⋮
interface Props {
  header?: Component
  body?: Component
  footer?: Component
}

const fragments: Props = {
  header: FragProfile,
  body: FragSubject,
  footer: TypeSection
}
</script>

demo

Relaterade artiklar