Первый тег img показывает изображение, второй, использующий интерполяцию, отсутствует в интерфейсе Vue.js.

Question

У меня есть 2 img теги:

<img src="@/assets/img/profileicon/3867.png"/>
<img :src="'@/assets/img/profileicon/' + this.summonerInfo.profileIconId + '.png'">

this.summonerInfo.profileIconId хранит число 3867, что означает, что оба тега img должны отображать одно и то же изображение, однако первый отображает изображение, а второй - нет. Когда я проверяю, первый img src ведет к "/img/3867.png", а второй img src ведет к "@/assets/img/3867.png"

Из моей корневой папки структура папок выглядит следующим образом:

src->assets->img->profileicon

Есть идеи, почему второй тег img не отображает изображения?

Answer 1

скопировать изображение в папку '/ public / img' в корневом проекте

<img src="/img/profileicon/3867.png"/>