So fügen Sie Bilder in vue.js hinzu

Die Methode zum Hinzufügen von Bildern in vue.js ist: Zuerst die hinzuzufügenden Bilder in eine JSON-Datei einfügen; dann auf die JSON-Datei auf der Vue-Seite verweisen, z. B. [import imgs from „../../static /“ json/img.json"].

Die Betriebsumgebung dieses Tutorials: Windows 7-System, Vue2.9.6-Version, Dell G3-Computer.

vue.js Die Methode zum Hinzufügen von Bildern ist wie folgt:

(Lernvideofreigabe: php-Video-Tutorial)

Methode 1: Speichern Sie den Bildpfad in Daten

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

Methode 2: Gehen Sie direkt zu Funktionsmethode Greifen Sie auf den Bildpfad zu

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

Methode 3: Fügen Sie die Bilder in eine JSON-Datei ein und verweisen Sie dann auf die JSON-Datei auf der Vue-Seite

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

Verwandte Empfehlungen: vue.js-Tutorial

Das obige ist der detaillierte Inhalt vonSo fügen Sie Bilder in vue.js hinzu. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!