vue中无法直接引入静态资源图片,如何解决?
动态绑定图片src地址:
<img :src="item.img" alt="" />
vue实例data中设置路径值:
img: "../assets/images/beside.png",
但是我们会发现,此种方式并没有解析出图片路径。解决此问题有两种方式,如下:
- 通过require() 方法进行引入(推荐)
img:require('../assets/images/beside.png')
- 通过import 方式将所需图片导入(每个所需要的图片都需要导入,很麻烦,不建议使用)
import img1 from '../assets/images/mid.png'
img:img1