裁剪 JS 库在 Election 中不起作用

问题描述

我正在尝试在我的 Electron 应用程序中添加一个简单的图像裁剪功能。我想要类似 this 的东西。

我尝试过 react-image-crop 和 react-cropper，但都没有奏效。

对于后一个库，我只是做了：

import React,{ useState } from 'react';
import Cropper from 'react-cropper';
import 'cropperjs/dist/cropper.css';

const ImageCrop = () => {
  const [upImg,setUpImg] = useState();

  const onSelectFile = e => {
    if (e.target.files && e.target.files.length > 0) {
      const reader = new FileReader();
      reader.addEventListener('load',() => setUpImg(reader.result));
      reader.readAsDataURL(e.target.files[0]);
    }
  };

  return (
    <>
      <div>
        <input type="file" accept="image/*" onChange={onSelectFile} />
      </div>
      <Cropper src={upImg} />
    </>
  );
};

export default ImageCrop;

结果如下所示，我无法选择区域。

使用以前的库，它只在图像周围显示一个橙色框，并且不允许对其进行裁剪。

我想某些 JS 功能在 Electron 中以某种方式不起作用，但我不知道这里到底发生了什么。任何帮助解释它并使其工作将不胜感激。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）