问题复现：
一开始是这样写的：
<img :src="'../../assets/'+ item.picUrl +'.png'" />
结果图片不显示，控制台报错404，图片的加载地址解析为：http://test.hengdaomed.com/assets/doc_chen.png
解决方案：添加require()
<img :src="require('../../assets/'+ item.picUrl +'.png')" />
此时图片就可以正常显示，图片的加载路径经过webpack编译后解析为：http://test.hengdaomed.com/pda-fe/static/img/doc_chen.3c27b5b.jpg
原因：
图片资源是静态文件，而静态资源可以用两种方式进行处理：
1. 在 JS 导入或在 template/CSS 中通过相对路径被引入。这类引用会被webpack处理。 2. 放置在 static 目录下或通过绝对路径被引入(vue-cli3是 public 目录)。这类资源将会直接被拷贝，而不会被 webpack 处理。
在vue的项目中，webpack使用的是vue-loader，在编译过程中，所有的资源路径例如 <img src="...">、background: url(...) 和 @import 会作为模块依赖。
而动态加载图片，图片的地址无法被解析，因此最终没有被打包到文件中，找不到该图片。