首頁  >  文章  >  web前端  >  vue.js圖片怎麼插入

vue.js圖片怎麼插入

coldplay.xixi
coldplay.xixi原創
2020-11-09 15:02:423990瀏覽

vue.js圖片插入的方法:1、在data裡面將圖片路徑保存好;2、函數方法裡面直接去存取圖片路徑;3、將圖片統一放在一個json檔案中,之後在vue頁面中引用json檔。

vue.js圖片怎麼插入

【相關文章推薦:vue.js

vue.js圖片插入的方法:

方法一:在data裡面將圖片路徑保存好

imgList: [
          {
            openItem: '../static/icon/ic_police.png'
          },
          {
            openItem: '../static/icon/ic_prepay_confirm.png'
          },
          {
            openItem: '../static/icon/ic_checkout.png'
          },
          {
            openItem: '../static/icon/ic_lvye.png'
          },
          {
            openItem: '../static/icon/ic_invoice.png'
          },
          {
            openItem: '../static/icon/ic_bill.png'
          }
        ]

方法二:函數方法裡面直接去存取圖片路徑

let src = require('../../assets/homeImg/home_icon1.png');

方法三:將圖片統一放在一個json檔案中,之後在vue頁面中引用json檔案

import imgs from "../../static/json/img.json"
export default {
data () {
return {
imgList: imgs.images
}
}
}

#相關免費學習推薦:javascript(影片)

#

以上是vue.js圖片怎麼插入的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn