Javascript 单击按钮后第二次出现上载对话框

我遇到了一个真正的问题，我不知道如何防止这个对话框出现后，我点击上传按钮

我将Vuejs框架用于前端

因此，首先我从input type=file出现的对话框中选择我的文件图像，然后在触发onPickFile方法的按钮上，再次出现要上载的对话框。我只是希望它出现在第一次当我选择图像不再

我试着用了一种新方法，但没办法

以下是我的例子：

<template>
        <img :src="imageURL" height="100">
        <div class="file-field input-field">
            <div class="btn">
                <span>File</span>
                <input type="file" name="cover-images" ref="fileInput" accept="image/*" @change.prevent="onFilePicked">
            </div>
            <div class="file-path-wrapper">
                <input class="file-path validate" type="text" placeholder="Upload your Profile image">
            </div>
        </div>
        <!-- v-on:click -->
        <button type="button" class="btn waves-effect waves-light " @click.prevent="onPickFile">Upload</button>
</template>

<script>
    methods: {
        onPickFile() {
            var accessToken
            var self = this;
            firebase.auth().currentUser.getIdToken( /* forceRefresh */ true).then(function(idToken) {
                accessToken = idToken

                self.$refs.fileInput.click()

                axios.post('http://api-link/example', {
                        content_type: self.image.type
                    }, config).
                then(response => {
                        self.uploadUrlLink = response.data.upload_url

                        axios.put(self.uploadUrlLink, self.image, config).
                        then(response => {
                            console.log(response)
                        })
                        .catch(e => {
                            console.log(e)
                        });
                    })
                    .catch(e => {
                        console.log(e)
                    });
            }).catch(function(error) {
                console.log(erroe)
            });

        },
        onFilePicked(event) {
            const files = event.target.files
            let filename = files[0].name
            if (filename.lastIndexOf('.') <= 0) {
                console.log("no valid file")
            }
            const fileReader = new FileReader()
            fileReader.addEventListener('load', () => {
                this.imageURL = fileReader.result
            })
            fileReader.readAsDataURL(files[0])
            this.image = files[0]
            var contentype = files[0].type
        },
    }
</script>

---

您正在再次调用一次上载的文件的单击事件

删除：self.$refs.fileInput.click，单击按钮后的对话框将不再显示