Vuejs image src динамическая загрузка не работает

Я только начал использовать Vue.js и Vue CLI, и у меня возникла проблема, я не понимаю, почему я не могу динамически установить изображение из области видимости, но я могу сделать это, записав его непосредственно в HTML, obj.img это строка с @/assets/logo.png значение тоже. У меня есть тайм-аут при фальсификации вызова ajax, но браузер не может правильно разрешить маршруты для изображения.

<div slot="media">
        <img :src="obj.img"> <!-- http://localhost:8080/@/assets/logo.png -->
        <img src="@/assets/logo.png"> <!-- http://localhost:8080/img/logo.82b9c7a5.png -->
</div>

Кроме того, почему маршруты разные? Есть идеи?

2 ответа

Решение

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

:src="getImage(obj.img)"

getImage(path) {
  return require(path)
}

Вы можете прочитать больше об этом в ответе Эвана, создателя Vue.

Хороший!

Как показал @Ohgodwhy, Vue не получает путь к изображению напрямую.

Вот как можно установить источник изображения:

      <v-img max-height="150" max-width="250" :src="getImage()"></v-img>

а затем в методах вам нужно:

      methods: {
    getImage() {
      return require("./logo.png");
    },
  },

И это сделано! Я новичок и у меня много дел.

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