Запуск «загрузчика изображений» с помощью vuejs из метода компонента

#javascript #vue.js #vuejs2

#javascript #vue.js #vuejs2

Вопрос:

У меня есть этот код :

 <dropdown-group
  @clickDropdownOption="clickDropdownOptionGroupBtn"                        
></dropdown-group>

<image-uploader
    :debug="1"
    class="d-none"
    ref="file"
    :maxWidth="512"
    :quality="0.7"
    :autoRotate="true"
    outputFormat="verbose"
    :preview="false"
    :capture="false"
    doNotResize="['gif', 'svg', 'pdf']"
    @change="uploadFile"
></image-uploader>
 

Функция clickDropdownOptionGroupBtn :

 clickDropdownOptionGroupBtn() {
    let fileInputElement = this.$refs.file;
    fileInputElement.click();
}
 

Итак, я хочу открыть image-uploader при нажатии на выпадающий список, но у меня ошибка : TypeError: fileInputElement.click is not a function

Заранее спасибо.

Комментарии:

1. Какова связь между fileInputElement и функцией clickDropdownOptionGroupBtn и загрузчиком изображений?

2. это не имеет значения отношение. Проблема в том, как я могу запускать <image-uploader> из clickDropdownOptionGroupBtn функции

Ответ №1:

Когда у вас есть ссылка из компонента, вы можете запустить любой существующий метод из компонента.

Предположим submitImage , что метод существует внутри image-uploader , тогда вы можете вызвать родительский элемент, выполнив:

 clickDropdownOptionGroupBtn() {
    this.$refs.file.submitImage();
}
 

Комментарии:

1. Не работает, потому input что находится внутри компонента : image-uploader . Я не знаю, существует ли способ доступа к этому элементу

2. Я отредактировал ответ, я думаю, вы хотите запустить метод внутри компонента.