Почему компоненты vue не изолированы в данном случае?

Question

[dk-web]

Доброго дня.
Собственно есть компонент - загрузка фото.
Я его тиражирую в 4 экземплярах

<lap-view :side="'/11.png'"></lap-view>
    <lap-view :side="'/12.png'"></lap-view>
    <lap-view :side="'/13.png'"></lap-view>
    <lap-view :side="'/13.png'"></lap-view>

Передаю ссылку на изображение - собственно этим они и отличаются.

В компоненте вывожу

<img :src="side" class="dressImg">
      <div class="resizable2" :style="{ 'background-image': 'url(' + image + ')' }">
          </div>

data как и сказано в доках - функция.

export default {
  name: "lapview",
  props: ["side"],
  data() {
    return {
        image: ""
    };
  }

В общем - я загружаю фото.. но все идет в первый компонент.
Еще заметил, что у меня в приложении пропали data атрибуты... обычно же vue проставляет ... div data="абракадабра"
В чем может быть причина?

Comments

[lavezzi1]

Ничего не понятно. Сделай jsfiddle в качестве примера.

[#FFFFFF]

но все идет в первый компонент.

что вы имеете в виду?
если что, image у вас везде одинаковый по коду. Я так понимаю, отличаться только side должен.
А вообще да, используйте https://codesandbox.io/s/vue например