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

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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