在vue中动态绑定图片还是经常会用到的,下面我来分享一下我动态绑定图片的方法
在vue中绑定动态的src有一下几个步骤:
一、把本地用动态绑定的图片写成数组或者对象。如下
![](https://i-blog.csdnimg.cn/blog_migrate/9c22728ef61849b66e2ffbefd39faed6.png)
二、在组建中使用,实现动态绑定
v-bind:src="";可以简写为:src。具体的写法看下面
接下来我们看看效果啊
![](https://i-blog.csdnimg.cn/blog_migrate/748983ec4cda15914d2da41b9a684415.png)
如果按照我上面的写法就会出现上图的问题,图片出不来,海报404错误。
解决办法:
表示我们的图片要用require引进来,静态资源都要用require引入。
改写成这样之后,我们在看看效果
如果动态绑定的图片的时候也出错了,记得检查一下是否是这个问题哟,因为很容易忽略掉。