ホームページ >ウェブフロントエンド >jsチュートリアル >vue2.0 でさまざまなイメージをループしてロードする (詳細なチュートリアル)
ここで、vue2.0 でさまざまな画像をループして読み込む方法を共有します。これは非常に参考になるので、皆さんのお役に立てれば幸いです。
デモ:
<p v-for="item in temps" :key="item.id">
<p class="contract-item">
<img :src="item.imgUrl">
</p>
</p>
画像を導入し、パスに注意してください:
import con1 from "@/assets/img/con01.png"; import con2 from "@/assets/img/con02.png"; import con3 from "@/assets/img/con03.png";
画像をロードします:
temps: [
{
imgUrl: con1
},
{
imgUrl: con2
},
{
imgUrl: con3
},
],
これにより、サイクル 移動中にさまざまな画像をロードします。 上記は私があなたのためにまとめたものです。 関連記事:
vue.jsの下部ナビゲーションバーで、第1レベルのルートを表示する方法とサブルートが表示されない問題の解決方法は?
JavaScriptを介してWeChatのランダム切り替えコードを実装する方法(詳細なチュートリアル)
AngularJSに従って現在のルーティングページをリロードする方法は何ですか?
以上がvue2.0 でさまざまなイメージをループしてロードする (詳細なチュートリアル)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。