Vue 3 – Angabe des Typs von Komponenten und Requisiten bei deren Verwendung als Funktionsparameter

Question

In Vue3 erstelle ich eine Funktion, die eine Instanz einer Komponente und eine zu übergebende Eigenschaft akzeptiert. Ich verwende auch TypeScript und frage mich, ob es möglich ist, diese Parameter einzugeben. Die Funktion würde beispielsweise so aussehen: constexample=(component,props)=>{//}. Meine Frage lautet also: Wie spezifiziere ich den Typ der Komponenteninstanz? Dabei handelt es sich nicht immer um die gleichen Komponenten, aber zumindest um Komponenten, die ähnlichen Zwecken dienen. Gibt es eine Möglichkeit für mich, den Typ der Requisite anzugeben und sie auf die Requisite des ersten Parameters (Komponente) zu beschränken?

P粉917406009 · Answer

您可以使用 typescript 提供的许多功能和 vue 中的 Component 类型来实现正确的键入，创建一个扩展 Component 的通用类型，然后推断组件选项/props 使用 infer，使用 Partial 使它们成为可选：

import type { Component } from "vue";

function example
(Comp: T, props: T extends Component ? Partial : never) {
 //....
  }

example(Alert, { variant: "success"})

注意：这也推断属性和组件实例实用程序