Тег img правильно отображает изображение, но v-bind не отображает

Question

            <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>

Тег image в приведенном выше примере действительно показывает изображение, а директива 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>

Так выглядит сайт

Answer 1

Это работает! :)

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