vue 中给 img 标签动态绑定 src 属性需要用到 require() 函数，比如：

<div v-for="(item, index) in listData" :key="index" class="item">
    <div class="icon">
        <img :src="item.src" alt="">
    </div>
    <div class="info">{{item.info}}</div>
</div>

data() {
    return {
        listData: [
            {src:require('./../../assets/img/message.svg'),info: '消息'},
            {src:require('./../../assets/img/integral.svg'),info: '积分'},
            {src:require('./../../assets/img/members.svg'),info: '会员'}
        ]
    }
}

v-for 循环遍历 listData 数组中的每一个对象，然后将拿到的每一项 item 的 src 值绑定给 img 标签的 src 上，数组 listData 中的 src 写的是每张图片的路径，这个路径必须要用 require 函数包裹起来，否则图片将显示不出来。

注意：require() 中不能有变量出现，如果你有这样的问题，可以移步到 → 传送门。