关于vue和elementui 动态图片展示
1.写代码的时候遇到Error: Cannot find module…这种错误
数据库中直接存的是一个相对路径就是这样:
![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/3aa93d580c160e28fbcf7207a4f5d807.png)
2.代码是这样的:
:src="require(this.item.technician.headerImg)"
3.错误是这样的:
![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/01c2ff59396592747a036540dc49cd95.png)
4.于是我直接在数据库中存文件名字,然后前面的相对路径固定写死,后面打算拼接文件名字
![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/f9e591862d45a6cb51a1738507bf79d3.png)
代码改成require('../../../assets/imgupload/'+this.item.technician.headerImg)
最终就可以动态展示图片了。
正常写死路径
<img :src="require('../../../assets/icons/selected.png')" class="header-img" />
还可以在下面生命变量
<img v-if="headerImg" :src="headerImg" class="header-img" />
下面data中data() { return { headerImg: require('../../../assets/icons/selected.png'), } },