vuejs: динамический путь к изображениям

Я пытаюсь создать простой список с фотографиями, но я не понимаю, как динамически создавать патчи.

шаблон

<ul class="thumbnail-list">
    <li class="thumbnail-list__item thumbnail" v-for="item in data">
        <img :src="src(item.cover)" alt="">
    </li>
</ul>

скрипт

computed: {
    src(img) {
        return require(`./photos/${img}`);
    },
},

Это приводит к "Этот относительный модуль не был найден:"

Я попробовал это тогда с @

return require(`@/photos/${img}`);

Но потом я получаю это сообщение Неожиданный require(), Вызовы require () должны использовать строковые литералы

Наконец то попробовал

return require('@/photos/' + img);
return require('~@/photos/' + img);

Но это также не работает, я получаю ошибки

Неожиданное требование (), вызовы require () должны использовать строковые литералы, неожиданное объединение строк

Мои фотографии находятся в папке "src/photos/"

Если я вставлю в свой шаблон жестко закодированный src, он найдет изображение

<img src="~@/photos/1.jpg">

так что я делаю не так??;)

0 ответов

Другие вопросы по тегам