我正在使用Meteor,Slingshot和React。 Slingshot的图片上传到亚马逊正在运作,但我无法获得进度指示。
当我console.log(upload.progress())
时,日志返回NaN,直到上传完成,此时它返回1
。对于进度指示器,我需要一个%来处理。
import React from "react";
const upload = new Slingshot.Upload("myImageUploads");
class Uploader extends React.Component {
constructor(props) {
super(props);
this.state = {};
this.handleUpload = this.handleUpload.bind(this);
}
handleUpload() {
const file = this.fileInput.files[0];
upload.send(file, function(error, downloadUrl) {
if (error) {
console.error("Error uploading");
alert(error);
} else {
console.log("Success!");
console.log(downloadUrl);
Meteor.call(
"user.updatePic",
{
imgUrl: downloadUrl
},
err => {
if (err) {
console.error(err);
}
}
);
}
});
setInterval(() => {
console.log(upload.progress());
}, 100);
}
render() {
return (
<div>
<input
type="file"
name="Uploader"
id="input"
ref={input => (this.fileInput = input)}
/>
<button
type="button"
className="btn btn--iconOnly"
onClick={this.handleUpload}
>
Upload
</button>
</div>
);
}
}
export default Uploader;