Maison >interface Web >Voir.js >Comment insérer des images vue.js

Comment insérer des images vue.js

coldplay.xixi
coldplay.xixioriginal
2020-11-09 15:02:424068parcourir

Méthode d'insertion d'image Vue.js : 1. Enregistrez le chemin de l'image dans les données ; 2. Accédez directement au chemin de l'image dans la méthode de fonction ; 3. Mettez les images dans un fichier json, puis les fichiers json sont référencé dans la page vue.

Comment insérer des images vue.js

[Recommandations d'articles connexes : vue.js]

insertion d'image vue.js Méthode :

Méthode 1 : Enregistrer le chemin de l'image dans les données

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

Méthode 2 : Accéder directement au chemin de l'image dans la méthode fonction

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

Méthode 3 : Unifiez les images dans un fichier json, puis référencez le fichier json dans la page vue

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

Recommandations d'apprentissage gratuites associées : javascript (vidéo)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn