vuetify не загружает изображение вхотя проп показывает, что у него есть URL - PullRequest
Новая
       17

vuetify не загружает изображение вхотя проп показывает, что у него есть URL

0 голосов
/ 26 апреля 2019 
<v-img :src="getPhoto()"  height="200px" width="200px"></v-img>

для загрузки фото из функции getphot. у src есть URL для facebook, но vuetify ничего не загружает enter image description here

computed: {
  user () {
    return this.$store.getters.user
  }
},
methods: {
  getPhoto () {
    return this.$store.getters.user.photoUrl
  }
}

Я не получаю никакой ошибки. и когда я использую ссылку, я могу получить доступ к изображению. потому что я вошел в систему с моего устройства. примечание: я использую firebase для всех этих

1 Ответ

1 голос
/ 26 апреля 2019

Попробуйте 

<v-img :src="require('getPhoto()')"  height="200px" width="200px"></v-img>

вместо 

<v-img :src="getPhoto()"  height="200px" width="200px"></v-img>

Vue loader автоматически преобразует относительные пути в требуемые функции. К сожалению, это не тот случай, когда речь идет о пользовательских компонентах. Вы можете обойти эту проблему, используя require. Если вы используете Vuetify в качестве плагина Vue-CLI 3, вы можете редактировать файл vue.config.js вашего проекта, изменив параметры для vue-loader. 

// Incorrect
<v-img src="../path/to/img" />

// Correct
<v-img :src="require('../path/to/img')" />

Источник: Подтвердить

Обновление: Когда не использовался относительный путь, я попытался создать пример использования функции для получения URL для источника изображения. Я думаю, что с вашим кодом есть две проблемы:

  1. Удалить () из getPhoto() в <v-img>
  2. Добавьте getPhoto() к вычисляемому свойству .

Вот Codepen

Надеюсь, это поможет.

...