vue动态绑定img标签的src地址

问题代码：

<li v-for="(item,index) in images" :key="index">

<img :src="item.src"></li>

若是使用vue-lazyloader加载那就是：

<img v-lazy="item.src"></li>

以上代码会出现控制台会报错404的的错误，缘由以下：

摘自：https://blog.csdn.net/mr_yanyan/article/details/78783091

在webpack中会将图片图片来当作模块来用，由于是动态加载的，因此url-loader将没法解析图片地址，而后npm run dev 或者npm run build以后致使路径没有被加工。

 

解决方法：加个require()

摘自：https://blog.csdn.net/qq_39313596/article/details/84644500

<img :src="require('../assets/images/'+imgsrc+'.png')"/>

<img v-lazy="require('../assets/images/'+imgsrc+'.png')"/>

注意：require(../assets/images/）这部分是把整个images文件夹都加载进来了，没有用到的图片也会被加载进来。不知道会不会影响页面加载速度。

本身另外创建了一个文件夹放动态加载的图片。