Input輸入框調用攝像機
<input type="file" class="input" accept="image/jpg, image/jpeg" capture="camera">
1 限制文件類型accept="" accept屬性必須用“image/*”accept表示，直接打開系統 文件目錄。
2 capture捕獲系統默認的設備 camera--照相機；camcorder--攝像機；microphone--錄 音。
3 multiple 支持多選 加上multiple后，capture就沒啥用了，因為multiple是專門用 來支持多選的。
獲取上傳的對象
<input type="file" @change="tirggerFile($event)">
tirggerFile : function (event) {
var file = event.target.files; // (利用console.log輸出看file文件對象)
let fileUrl = URL.createObjectURL(file [0]); // 獲取文件url
}
本人的例子：
<input class="fileStyle" @change="cha($event)" type="file" multiple accept="image/*">
cha(event){
let fileList = event.target.files;//文件信息
let fileUrl = URL.createObjectURL(fileList[0]); // 獲取文件url
this.uploadingImg=fileUrl
},
data() {
return {
uploadingImg:'', //用戶上傳的圖片
}},
其他
<input type="file" name="file" @change="selectPhoto($event)" accept="image/*"multiple>
selectPhoto(event){
console.log(event.target.files)
let fileList = event.target.files
for(let i=0;i<fileList.length;i++){
this.fileArry.push(fileList[i])
let fileUrl = URL.createObjectURL(fileList[i]); // 獲取文件url
this.list.push({msrc:fileUrl,src:fileUrl}) // data中顯示的圖片url
}
// let fileList=$(".photoFile").get(0).files[0] // 獲取input file 文件信息
// let fileUrl = URL.createObjectURL(fileList); // 獲取文件url
// this.fileArry.push(fileList)
console.log(this.fileArry)
// this.list.push({msrc:fileUrl,src:fileUrl})
event.target.value = "" // 解決不能選同一個文件
},
本人的參考連接
https://bbs.csdn.net/topics/391015496
https://blog.csdn.net/weixin_33901641/article/details/91444059
https://jingyan.baidu.com/article/cbcede071f349f02f40b4d38.html