方法一:在 data 中定义
- 在
data()
里面定义好图片路径,需要在链接外面加上require
data(){
return {
imgUrl:require("../assets/test.png"),
}
}
- 在
template
模板里面使用,需要使用v-bind (简写 : )
绑定图片的src属性
<template>
<img :src="imgUrl">
</template>
方法二:使用 import 导入
- 引入:
import imgUrl from '@/assets/logo.png'
- 使用:
<template>
<img :src="imgUrl">
</template>
方法三:在created 中设置
- 定义:
data() {
return {
imgUrl:" "
}
}
created() {
let urlTemp = "assets/test.png";
this.imgUrl = require("@/" + urlTemp)
}
- 使用:
<template>
<img :src="imgUrl">
</template>