Nuxt v3 にカルーセル コンポーネントを実装したいと考えています。このコンポーネントは項目のリストを受け取ります。このコンポーネントはロジックのみを実装し、スタイルや構造は実装しません。
これが私のコンポーネントです:
コンポーネント/tdx/carousel.vue
カルーセルのロジックはここでは重要ではありません。
親コンポーネントでは、次のようにコンポーネントを使用できます:
リーリーこれはうまくいきます。それ以外に私が欲しいのはタイピングです。 title
と description
のタイプは、もちろん任意です。carousel.vue
の小道具では、項目のタイプは unknown[] であるためです。
。
汎用コンポーネントの作成方法を示したこの記事を見つけましたが、nuxt の自動インポート システムをいじる必要があるため、これは望ましくありません。
carousel.vue
プロパティ内の特定の項目から型推論を実装するにはどうすればよいですか?
P粉4765470762023-11-03 18:29:13
Vue 3.3 以降、共通コンポーネントを正式にサポート.
共通パラメータを定義する必要があります。 carousel.vue
コンポーネントを変更して、 タグの
generic
プロパティを使用し、型ベースの defineProps
を使用するように変換します。メソッドを使用して、ジェネリックスを正しく取得できるようにします。
スロット上のプロパティがアイテム タイプに基づいて正しく推測されるようになりました。
Experimental フラグ を有効にする必要がありました。
tsconfig.json の experimentalRfc436 オプションを
vueCompilerOptions で有効にする必要があります。
リーリー