vue2.0 循環遍歷加載不同圖片的方法

來源：懂視網責編：小采時間：2020-11-27 22:18:01

vue2.0 循環遍歷加載不同圖片的方法

vue2.0 循環遍歷加載不同圖片的方法:demo： <div v-for=item in temps :key=item.id> <div class=contract-item> <img :src=item.imgUrl> </div> </div> 引入圖片，注意路徑： import con1 from @/

推薦度：

點擊下載本文 文檔為doc格式

導讀vue2.0 循環遍歷加載不同圖片的方法:demo： <div v-for=item in temps :key=item.id> <div class=contract-item> <img :src=item.imgUrl> </div> </div> 引入圖片，注意路徑： import con1 from @/

demo：

 <div v-for="item in temps" :key="item.id">
 <div class="contract-item">
 <img :src="item.imgUrl">
 </div>
 </div>

引入圖片，注意路徑：

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
 },
 ],

這樣就實現了循環遍歷的時候加載不同的圖片。

以上這篇vue2.0 循環遍歷加載不同圖片的方法就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支持腳本之家。

聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com

vue2.0 循環遍歷加載不同圖片的方法

推薦度：

點擊下載本文 文檔為doc格式

標簽：循環循環遍歷 vue2.0

熱門焦點

vue2.0 循環遍歷加載不同圖片的方法

vue2.0 循環遍歷加載不同圖片的方法

vue2.0 循環遍歷加載不同圖片的方法

最新推薦

猜你喜歡

熱門推薦