问题描述
使用原生img标签，src用v-bind动态绑定本地的url，由于图片放在了assets文件夹下，所以代码大致长这样：
<template>
<img :src="url">
</template>
<script>
//...
data() {
return {
url: "../assets/charts.jpg"
}
}
</script>
但打开浏览器看效果时却发现图片加载失败
遂谷歌
解决方案
这篇文章（https://www.cnblogs.com/ranyonsue/p/11608760.html）说得比较详细，主要是我们写的相对路径是相对于项目的根目录，而浏览器解析时会把根域名作为相对路径的根目录，所以图片才会加载失败。
采用文章中提到的方法，把图片放到了static文件夹下，就加载成功了。
不过这个带来的图片资源优化问题后续还需要解决，所以之后会尝试一下文章中提到的第三种方法。