linkmore-design/es/crop-img/body/index.js

🌈 🚀lm组件库。🚀

import _extends from "@babel/runtime/helpers/esm/extends";
/* tslint:disable */
import React, { useCallback } from 'react';
import Cropper from 'react-easy-crop';
var Index = function Index(_ref) {
  var instance = _ref.instance;
  var state = instance.state,
    imgURL = instance.imgURL,
    setTransform = instance.setTransform,
    minZoom = instance.minZoom,
    zoomSpeed = instance.zoomSpeed,
    aspect = instance.aspect,
    cropSize = instance.cropSize;
  var onCropComplete = useCallback(function (croppedArea, croppedAreaPixels) {
    // console.log('croppedArea:', croppedArea, 'croppedAreaPixels:', croppedAreaPixels)
    setTransform({
      croppedAreaPixels: croppedAreaPixels
    });
  }, [setTransform]);
  var cropConfig = {
    minZoom: minZoom,
    zoomSpeed: zoomSpeed,
    aspect: aspect,
    cropSize: cropSize
  };
  return /*#__PURE__*/React.createElement("div", {
    className: "lm_cutimg_crop"
  }, /*#__PURE__*/React.createElement(Cropper, _extends({}, cropConfig, {
    image: imgURL,
    crop: state.crop,
    zoom: state.zoom,
    rotation: state.rotation,
    onCropChange: function onCropChange(crop) {
      return setTransform({
        crop: crop
      });
    },
    onCropComplete: onCropComplete,
    onZoomChange: function onZoomChange(zoom) {
      return setTransform({
        zoom: zoom
      });
    }
  })));
};
export default /*#__PURE__*/React.memo(Index);