img 标签正确显示图像，但 v-bind 不正确答案

【问题标题】：img tag correctly displays image but v-bind does notimg 标签正确显示图像，但 v-bind 不正确
【发布时间】：2020-01-05 21:14:41
【问题描述】：

            <div class="row">
                <div :key="map.name" v-for="map in match.maps" class="col-lg-4 mt-5">
                    <img width="100" height="50" src="../assets/ovp.png">
                    <img v-bind:src="'../assets/' + map.name + '.png'">
                    {{ map.name }}
                </div>
            </div>

上面示例中的图像标签确实显示了图像，但是 v-bind 指令没有。什么是不正确的？检查代码时，它看起来像这样：

<div data-v-780f357b="" class="col-lg-4 mt-5">
  <img data-v-780f357b="" src="/img/ovp.3ffb145b.png" width="100" height="50">
  <img data-v-780f357b="" src="../assets/ovp.png">
  ovp
</div>

This is how the website looks

【问题讨论】：

这可能已经在stackoverflow.com/questions/40491506/… 中得到解答。

标签： html css image vue.js

【解决方案1】：

这行得通！ :)

v-bind:style="{backgroundImage: 'url(' + require('@/assets/' + map.name + '.png') + ')'}"

【讨论】：