关于vue页面中渲染动态的图片路径，我前几天又掉坑里，这让我不得不记录一下这次的问题。难吗？不难！就是一不小心掉坑里面。
首先是最常见的静态用法：

<img src="./assets/logo.png" alt="vue动态引入img的src，不得不说的坑！" title="vue动态引入img的src，不得不说的坑！">

还有我们都知道的vue中动态src如下的用法：

<img :src="imgUrl">
data: function () {
    return {
      imgUrl: require("./assets/logo.png"),
    }
}

或者

<img :src="require("./assets/logo.png")">

接下来就是深入的动态变量了，假设图片名字是变量，src的都在指定的assets的文件夹里面。

然后动态路径就拼接起来，如下：

<img :src="require('./assets/'+item+'.png')">

或者

<img :src="require('@/assets/'+item+'.png')">

vue动态引入img的src，不得不说的坑！-QUI-Notes
这两个一个是相对路径一个是绝对路径，都可以正常引入图片。

好了，以上就是vue动态引入img的src图片的全部内容，我是七娃，爱前端，爱分享。