Vue 3使用vite 2.0 动态引入加载图片 src，解决方法超级简单

我现在需要动态引入图片，因此要用到模板字符串和动态绑定。第一反应，当然就是如下写法：

<img :src="`../assets/blogPhotos/${name}.jpg`" alt="" />

但此时，控制台就报了一个错，说没有找到这张图片。

但我图片明明就放在那儿，你还说没找到。

这时一顿百度，没有找到结果。只能去vite的官网，没想到竟然被我找到解决方法了。

解决方法一

根据官网的提示，我找到了最简单的方法，就是在将asset 前面加上src。

<img v-if="post.welcomeScreen" :src="`/src/assets/blogPhotos/${name}.jpg`" alt="" />

果然还是路径写错了！

解决方法二

关于第二个方法，官网说：“实际上，Vite 并不需要在开发阶段处理这些代码！在生产构建时，Vite 才会进行必要的转换保证 URL 在打包和资源哈希后仍指向正确的地址。”

因此，以下的方法开发阶段不需要了解。

首先把给src绑定一个函数，然后把需要图片名字传给函数。

<img :src="" alt="getImageUrl(name)" />

接着写这个函数

function getImageUrl(name) {
    return new UR