Как пройтись по массиву картинок и вывести их на экран?

Question

[Freeman34]

У меня в проекте в папке public есть папка img, потому итерация проходит по ней, но картинки не выводятся на экран.
Подскажите, в чем проблема?
С меня благодарность.

<template>
  <div class="slider">
    <div class="sliderImage" v-for="(item, index) in ImageData">
      <img :src="item.image"/>
    </div>
  </div>
</template>
 
<script>
const ImageData = [
  {
    image: "/img/slider.jpg",
  },
  {
    image: "/img/salesSlider.jpg",
  },
  {
    image: "/img/ball.jpeg",
  },
];
 
export default {};
</script>
 
<styles>
 
</styles>

Comments

[kokapuk]

https://ru.vuejs.org/v2/guide/list.html

[Алексей Ярков]

но картинки не выводятся на экран

Я больше скажу. В консоль браузера даже ошибки пишутся. Кстати, а что там в консоли написано?

И с чего вы вообще взяли, что такой синтаксис в секции script сработает?

[Freeman34]

kokapuk, я все это читал и там нет ответа на мой вопрос

[Freeman34]

Алексей Ярков, вы можете сказать в чем тут проблема? Что я делаю не так?
Почему на реакте все просто, а во вью сплошные сложности

[Алексей Ярков]

Freeman34, хреново читали видимо. И да, повторю свой вопрос: какие ошибки в консоли браузера.

[WapSter]

А с чего ты взял, что template имеет доступ к переменным в script?

Answer 1

[Владимир Коротенко]

Как то так
https://play.vuejs.org/#eNqVUj1PwzAQ/SvWTVQqydAtap...