0

Я делаю flask приложение для конвертации форматов изображений, пользователь должен ввести url изображения и дальше выбрать формат сохранения но это не важно, важно то, что когда он полностью введет url квртинки она дожна отобразиться, но пока url не дейтсвителен, картика будет отображаться некрасивой иконкой, я хочу чтобы тег img был скрыт пока url не будет загружен без ошибки. Это тег img src берется из input text url, я пытался сделать так, чтобы при ошибке загрузке срыть img, а впротином случае сделать значение v-show img true, но видемо я сделал что-то не так помогите пожалуйста. Вот img:

<img :src="url_text" v-on="showImg" v-if="img_is_not_hide" @error="hideImg" id="preview">

Вот main.js

const form = new Vue({
    el: "#form",
    delimiters: ['[[', ']]'],
    data: {
        format: "...",
        url_text: "",
        img_is_not_hide: true
    },
    methods: {
        hideImg () {
            this.img_is_not_hide = false
        },
        showImg () {
            this.img_is_not_hide = true
        }
    }
})

Помогите пожалуйста)

1
  • Я не силён во Vue, но разве нельзя просто случшать собыите onload у изображения и смотреть на его успешность? Хотя наверное - это просто будет обратным тому что вы написали
    – EzioMercer
    2 мая 2022 в 12:53

1 ответ 1

0

у меня было что-то похожее, но я не помню как решил тогда

но мне кажется это можно решить через специальный аттрибут key который заставит перерисовываться картинку

<img :key="url_text" :src="url_text" v-on="showImg" v-if="img_is_not_hide" @error="hideImg" id="preview">
1
  • Ну это и так понятно, вопрос, что это за атрибут или директива.
    – user498036
    4 мая 2022 в 10:53

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими пользовательским соглашением, политикой конфиденциальности и политикой о куки

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.