Reputation: 23563
Im using Meteor, Slingshot and React. Slingshot's image upload to Amazon is working but I cant get the progress indication to work.
When I console.log(upload.progress())
the log returns NaN until the upload is complete, at which point it returns 1
. For a progress indicator I need a % to work with.
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;
Upvotes: 1
Views: 97