How to insert vue.js pictures

Vue.js image insertion method: 1. Save the image path in data; 2. Directly access the image path in the function method; 3. Put the image in a json file, and then json files are referenced in the vue page.

[Related article recommendations:vue.js]

vue.js image insertion Method:

Method 1: Save the image path in 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' } ]

Method 2: Directly access the image path in the function method

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

Method 3 : Put the pictures in a json file, and then reference the json file in the vue page

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

Related free learning recommendations:javascript(video)

The above is the detailed content of How to insert vue.js pictures. For more information, please follow other related articles on the PHP Chinese website!