我們經(jīng)常在網(wǎng)站中使用文件上傳功能，但是文件上傳功能通常都會占用一定的空間，影響網(wǎng)站的美觀。Vue 提供了一種隱藏 file 事件的方法，可以讓我們在上傳文件時美觀又實(shí)用。

上面的代碼中，我們定義了一個 type 為 file 的 input 元素，并設(shè)置了一個 ref 屬性為 fileInput，同時在 change 事件上綁定了 uploadFile 方法。同時，我們通過 display:none 隱藏了這個 input 元素。

methods: {
uploadFile: function () {
let fileInput = this.$refs.fileInput;
let formData = new FormData();
formData.append('file', fileInput.files[0]);
//上傳文件
}
}

在 methods 中，我們定義了一個名為 uploadFile 的方法，在這個方法中，我們通過 this.$refs.fileInput 獲取了我們隱藏的 input 元素，并使用 FormData 對象創(chuàng)建了一個 formData。

選擇文件

最后，在我們的模板中，我們定義了一個按鈕用于選擇文件，并綁定了 selectFile 方法。

methods: {
selectFile: function () {
this.$refs.fileInput.click();
},
uploadFile: function () {
let fileInput = this.$refs.fileInput;
let formData = new FormData();
formData.append('file', fileInput.files[0]);
//上傳文件
}
}

在 selectFile 方法中，我們通過 this.$refs.fileInput.click() 方法觸發(fā)了 input 元素的 click 事件，這樣就可以選擇文件了。

總的來說，Vue 提供了一種隱藏 file 事件的方法，讓我們在網(wǎng)站中實(shí)現(xiàn)文件上傳功能時更加的美觀和實(shí)用。這個隱藏 file 事件的方法也可以用在其他地方，讓我們的網(wǎng)站更加優(yōu)美。