Skip to content

Instantly share code, notes, and snippets.

@TRomesh
Forked from abachuk/ReactFileUpload.js
Created May 25, 2017 21:17
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save TRomesh/f133f20611360202da82af83c1cfab5e to your computer and use it in GitHub Desktop.
Save TRomesh/f133f20611360202da82af83c1cfab5e to your computer and use it in GitHub Desktop.
// Redux action
export function uploadSuccess({ data }) {
return {
type: 'UPLOAD_DOCUMENT_SUCCESS',
data,
};
}
export function uploadFail(error) {
return {
type: 'UPLOAD_DOCUMENT_FAIL',
error,
};
}
export function uploadDocumentRequest({ file, name }) {
let data = new FormData();
data.append('file', document);
data.append('name', name);
return (dispatch) => {
axios.post('/files', data)
.then(response => dispatch(uploadSuccess(response))
.catch(error => dispatch(uploadFail(error));
};
}
/*
... A lot of Redux / React boilerplate happens here
like mapDispatchToProps and mapStateToProps and @connect ...
*/
// Component method
handleFileUpload({ file }) {
const file = files[0];
this.props.actions.uploadRequest({
file,
name: 'Awesome Cat Pic'
})
}
// Component render
<input type="file" onChange={this.handleFileUpload} />
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment