【VUE】动态import
、require
显示img图片
[why]为什么引入import
、require
在VUE中,经常会有显示图片的场景,如果是想要进行普通的展示的话,那么这样就按照下方的写就可以了
<img src="../assets/images/photo.jpg" width="100%">
其中../assets/images/photo.jpg
是图片的路径
但是当我们移动了图片的位置的时候,所有用到这张图片的地方都需要修改代码
所以import
、require
的作用就显现出来了
[how]如何使用import
、require
动态显示
<img :src="logo">
import logo from '@assets/images/avatar.png';
data() {
return {
logo
}
}
<img :src="logo">
data() {
return {
logo:require("@assets/images/avatar.png")
}
}