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 サイトの他の関連記事を参照してください。