Vue3: 親 div のクラスに基づいて子の div を条件付きで表示します

Question

私は Vue を初めて使用するもので、Vue3 カルーセル プラグインでこのアクティビティ クラスの例に取り組んでいます。 carousel__slide--active クラスのテキストとリンク div のみを表示したかったのですが、すべての carousel__item に対応するテキストとリンクが表示されるようになりました。サブクラス carousel__slide--active に対して v-if または v-bind を実行して image.text と image.link を表示できるはずですが、どちらも機能させることができません。ご提案をいただければ幸いです

P粉080643975 · Answer

CSS を使用してこの問題を解決することもできますが、「vue-way」を使用する場合は、現在のスライドを確認してコンテンツを表示するかどうかを決定する必要があります。

使用法に関するドキュメントは (私が言うには) あまり明確ではありませんが、ソースコードを見ると、Carousel コンポーネントが modelValue を使用して次のことを行っていることがわかります。現在のインデックスをバインドします。

＃＃＃テンプレート：＃＃＃

     したがって、インデックス (

i

in v-for="(image, i) in stack.images") があり、それを currentSlide で実行します。比較する＃＃＃