Не видит картинки в карусели vuetifyjs. Как правильно прописать пути?

Question

[Ilya-1979]

<template>
           <v-carousel hide-delimiters>
             <v-carousel-item
             v-for="(item,i) in items"
              :key="i"
              :src="item.src"
               ></v-carousel-item>
            </v-carousel>
       </template>
      <script>
       export default {
         data () {
             return {
             items: [
            {
                    src: '@/assets/img1.jpg',
            },
           {
                  src: '@/assets/img2.jpg',
           },

          ],
       }
     },
   }

Comments

[2CHEVSKII]

Вы еще пять раз вопрос повторите, тогда точно ответят.

Answer 1

[Павел Т]

Проще всего положить картинки в public (или static) и обращаться к ним от корня /public/img1.jpg

Answer 2

[Kutuzov_ska]

Если еще актуально, можно попробовать сделать так:

import image1 from '../assets/img1.jpg'; // Путь прямой, не через @
import image2 from '../assets/img1.jpg';

export default {
  data: () => ({
    items: [image1, image2]
  })
}

Попробуйте так. Но концептуальнее будет, настроить nginx/apache, раздавать статику и картинки через него, а в img передавать уже просто пути;

<v-carousel-item
             v-for="(item,i) in items"
              :key="i"
              :src=" `http://***/img${i}.jpg` "
               ></v-carousel-item>
            </v-carousel>