用file API获取到文件
然后 传入封装的函数 点击选择文件之后 弹出这个报错 具体代码如下
报错的意思是 这个属性的对象并没有获取到 这个怎么解决
handleFiles(e){
const imgfile = e.target.files[0];
//图片文件大小和格式验证
const fileMaxSize = 500000;
if(!/image\/\w+/.test(imgfile.type)){
alert('选择的文件不是图片');
return false;
}
if(imgfile.size <= fileMaxSize){
this.uploadImg(imgfile);
}else{
alert("文件过大");
}
}
//上传示例
uploadImg(imgSource) {
console.log(imgSource);
const uptoken = this.props.uiStore.imgupload.token;
const file = imgSource //Blob 对象,上传的文件
const key = null // 上传后文件资源名以设置的 key 为主,如果 key 为 null 或者 undefined,则文件资源名会以 hash 值作为资源名。
let config = {
useCdnDomain: false, //表示是否使用 cdn 加速域名,为布尔值,true 表示使用,默认为 false。
region: qiniu.region.z0 // 根据具体提示修改上传地区,当为 null 或 undefined 时,自动分析上传域名区域
};
let putExtra = {
fname: imgSource.name, //文件原文件名
params: {}, //用来放置自定义变量
mimeType: ["image/png", "image/jpeg"]
};
let observable = qiniu.upload(file, key, uptoken, putExtra, config);
observable.subscribe({
next: (res) => {
// 主要用来展示进度
let total = res.total;
console.log("进度:" + parseInt(total.percent) + "% ")
},
error: (err) => {
// 失败报错信息
console.log(err)
},
complete: (res) => {
// 接收成功后返回的信息
console.log(res.hash)
}
})
}
抱歉 找到原因了