vue的三種圖片引入方式
- 首先給圖片地址綁定變量：
<template> <img :src="imgUrl"> </template> - 在script中設置變量：
//方法1：直接將圖片引入為模塊 require imgUrl from "../assets/test.png" //方法2：把imgUrl放在數據中 data() { return { imgUrl:require("../assets/test.png") } } 補充方法2：(在data數組中保存數據的情況） data() { test: [ { imgUrl: require('../assets/test.png'), id: '1' }, ], ... } //方法3：在生命周期函數中設置 data() { return { imgUrl:" " } } created() { let urlTemp = "assets/test.png"; this.imgUrl = require("@/" + urlTemp) } </script>