input type="file" 上傳文件的一些使用

web可以使用Input type="file"來上傳圖片或者文件

<input name="myFile" type="file">

對應事件：change

常用屬性：accept, multiple, capture

accept：限制文件類型

audio/* 表示所有音頻文件 HTML5（支持）

video/* 表示視頻文件 HTML5（支持）

image/* 表示圖片文件 HTML5（支持）

支持逗號分隔的 MIME 類型字符串，寫可以寫成如下的方式：

accept="image/png" 或者 accept=".png" ，只接受 png 圖片。

accept="image/png, image/jpeg" 或者 accept=".png, .jpg, .jpeg" ，接受 PNG 和 JPEG 文件。

accept="image/*" ，接受任何圖片文件類型。

multiple（多選）：

multiple 屬性：當用戶所在的平台允許使用 Shift 或者 Contro鍵時，用戶可以選擇多個文件。

如果不希望多選，可以直接忽略 multiple 屬性。

capture（調用設備媒體）：

capture 屬性：在webapp上使用 input 的 file 屬性，指定 capture 屬性可以調用系統默認相機、攝像和錄音功能。

capture表示，可以捕獲到系統默認設備的媒體信息，如下：

capture="camera" 相機

capture="camcorder" 攝像機

capture="microphone" 錄音

還可以設置capture="user"相機前置攝像頭

具體使用實例：

/*html部分*/
<input type="file" @change="toBase64($event)" class="upload_img">

/*js部分*/
toBase64(e){
            let _this = this;
            let files = e.target.files[0];
            let reader = new FileReader();
            reader.readAsDataURL(files);
            reader.onload = function() {
                let imgcode = this.result.replace(/^data:image\/(jpeg|png|gif|jpg|bmp);base64,/, '');
                //其他操作
            };
            //清空數據
            e.target.value = '';
        }