vue2.0 は、すべての画像をロードするメソッドをループします。

今回は、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
    },
   ],

この記事の事例を読んだ後は、この方法を習得したと思います。さらに興味深い情報については、PHP 中国語 Web サイトの他の関連記事に注目してください。 推奨読書:

vuex のプロジェクト構造と構成の概要

webpack4 にアップグレードした後の vue-cli 3.0.x の新機能とは何ですか

以上がvue2.0 は、すべての画像をロードするメソッドをループします。の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。