|
|
@@ -9,6 +9,7 @@ import 'react-image-crop/dist/ReactCrop.css';
|
|
|
|
|
|
class ProfileImageUploader extends React.Component {
|
|
|
|
|
|
+ // demo: https://codesandbox.io/s/72py4jlll6
|
|
|
constructor(props) {
|
|
|
super();
|
|
|
|
|
|
@@ -61,7 +62,7 @@ class ProfileImageUploader extends React.Component {
|
|
|
// }
|
|
|
}
|
|
|
|
|
|
- getCroppedImg(image, crop, fileName) {
|
|
|
+ async getCroppedImg(image, crop, fileName) {
|
|
|
const canvas = document.createElement('canvas');
|
|
|
const scaleX = image.naturalWidth / image.width;
|
|
|
const scaleY = image.naturalHeight / image.height;
|
|
|
@@ -69,7 +70,8 @@ class ProfileImageUploader extends React.Component {
|
|
|
canvas.height = crop.height;
|
|
|
const ctx = canvas.getContext('2d');
|
|
|
|
|
|
- ctx.drawImage(image, crop.x * scaleX, crop.y * scaleY, crop.width * scaleX, crop.height * scaleY, 0, 0, crop.width, crop.height);
|
|
|
+ ctx.drawImage(image, crop.x * scaleX, crop.y * scaleY, crop.width * scaleX, crop.height * scaleY,
|
|
|
+ 0, 0, crop.width, crop.height);
|
|
|
|
|
|
return new Promise((resolve, reject) => {
|
|
|
canvas.toBlob((blob) => {
|