1，读取本地图片，是循环列表，通过绑定读取出来的图片

如果是在assets里面的图片资源需要require的

<img class="goods-image" :src="require('../assets/'+item.img)" alt="" />

或者

<img class="goods-image" :src="require('@/assets/'+item.img)" alt="" />

2，图片资源是静止的

<img src="./assets/4g.jpg" alt=""> // √

 编译后:<img src="/img/01.f0cfc21d.jpg" alt="">

常见的引入方式，路径是固定的字符串，图片会被webpack处理，文件若丢失会直接在编译时报错，生成的文件包含了哈希值

3，:src="item.img"，如果采用改种方式，会报错的

<img :src="item.img" alt=""> // ×

// 编译后:<img src="./assets/4g.jpg" alt="">

错误的引入方式，使用:src调用了v-bind指令处理其内容，相对路径不会被webpack的file-loader处理

4，如果想要使用绝对的根路径的，一般引用的是public里面的资源，

用绝对路径引入时，路径读取的是public文件夹中的资源，任何放置在 public 文件夹的静态资源都会被简单的复制到编译后的目录中，而不经过 webpack特殊处理。
当你的应用被部署在一个域名的根路径上时，比如http://weixin70.yuanye.com/，此时这种引入方式可以正常显示

等我完全掌握vue.config.js配置再继续总结剩余的图片路径配置方式，例如<img :src="this.publicPath + 'images/4g.jpg'" alt="">