Vue中关于图片路径的写法问题

工作中遇到的小问题，恶心了我很久，记录下来防止还有人踩坑。

v-html可以把html语言直接渲染出来，但其中带来一部分问题，html中的图片路径（即<img src="xxx">）如果要进行替换修改，该怎么做？

问题的重点在于，图片（或者说资源信息，包括文件啥的）的存储位置怎么表示？实测Vue中在这一块是不能进行绝对路径表示的，只能用相对路径！

在Vue2里，图片放在static里，也就说你要改造项目，记得把图片文件夹放在static里。

在Vue3里，没有static了，图片文件夹就放在public下。

坑点来了！在写路径的时候，如果是图片路径，则不需要写出“public”

啥意思呢，举个例子：

    

<img src=\"../../public/img/1.png\" alt=\"\">

   一般这么写，代表的是当前的vue文件所在的位置，返回上一层目录，再返回上一层目录，然后在这层目录中选择public文件夹，选择里面的1.png。

   遗憾的是，这么写的话，你的图片压根显示不了，这是错误的路径写法。

   应改成

 <img src=\"../../img/1.png\" alt=\"\">

  这么写，表达的才是“当前的vue文件所在的位置，返回上一层目录，再返回上一层目录，然后在这层目录中选择public文件夹，选择里面的1.png”   

public不需要写出来！说实话，我没有搞懂这个简化有啥意义，而且还贼容易引起歧义...

---

更新于2022/04/16，实测，哪怕是非图片文件夹也不需要写public，反正不管怎么造，public就是得省略！！！