Vue 3 - コンポーネントとプロパティを関数パラメータとして使用する場合のタイプの指定

Question

Vue 3 では、コンポーネントのインスタンスと渡されるプロパティを受け入れる関数を作成しています。私も TypeScript を使用しているのですが、これらのパラメーターを入力できるかどうか疑問に思っています。たとえば、関数は次のようになります:

リーリー

それでは私の質問は次のとおりです:

1. コンポーネント インスタンスのタイプを指定するにはどうすればよいですか?これらは常に同じコンポーネントであるとは限りませんが、少なくとも同様の目的を果たすコンポーネントです。
2. プロップのタイプを指定し、それを最初のパラメーター (コンポーネント) のプロップに制限する方法はありますか?

Answer 1

typescript によって提供される多くの機能と vue の Component 型を使用して適切な型付けを実現し、Component を拡張するジェネリック型を作成して、コンポーネントのオプション/プロパティを推論できます。 infer を使用し、Partial を使用してオプションにします:

リーリー

注: これにより、プロパティとコンポーネント インスタンス ユーティリティも推論されます