vue 项目中，上传到本地的图片如何实现页面上的访问

前言

网上好多解答鱼目混珠，但是大部分都在划水，贴了大量代码，读完也没得收获。其实问题很简单，只要说出原理就可以了。
vue 不支持常规的文件访问方式，比如通过 file:///D:/opt/upFiles/temp/15618.png的方式，图片在 img 配置 src = file:///D:/opt/upFiles/temp/5618.png 也是无效访问。

解决方案

1、文件上传路径要调整到vue项目的 public 目录中
2、在页面中访问即可：src="/logo.png" 注意前面是不加 public 的，因为public访问默认 / 所以直接在后面拼接路径即可

vue（cli3.0）有两个放置静态资源的目录分别是public和assets。
public放不会变动的文件（相当于vue-cli2.x中的static）
public/ 目录下的文件并不会被Webpack处理：它们会直接被复制到最终的打包目录（默认是dist/static）下。必须使用绝对路径引用这些文件，这个取决于你vue.config.js中publicPath的配置，默认的是/。
assets放可能会变动的文件
assets目录中的文件会被webpack处理解析为模块依赖，只支持相对路径形式。
简单来说就是就是public放别人家js文件（也就是不会变动），assets放自己写js文件（需要改动的文件）

因为想到了 public是访问默认，我们可以通过相对路径去访问 assets 吧，好像是不能。
直接向 public 上传图片肯定是不提倡的，最好还是找个文件服务器吧！