JSX 元素类不支持属性，因为它没有“道具”property.ts(2607)答案

【问题标题】：JSX element class does not support attributes because it does not have a 'props' property.ts(2607)JSX 元素类不支持属性，因为它没有“道具”property.ts(2607)
【发布时间】：2021-11-12 03:14:17
【问题描述】：

我在使用 react-easy-crop 库中的“Cropper”时遇到此错误，我尝试了一些在论坛上找到的东西，例如添加 @types/react、从“react”导入 * 作为 React 但是似乎没有任何效果。

这是给我带来麻烦的代码：

import * as React from "react";
import Cropper from "react-easy-crop";

export default function CropperPage({action , valuePro}: any) {
   return (
     <Cropper //  <-- This is giving me the error
        cropShape= "round"
        disableAutomaticStylesInjection="true"
        image={image}
        crop={crop}
        zoom={zoom}
        aspect={1}
        onCropChange={setCrop}
        onZoomChange={setZoom}
        onCropComplete={onCropComplete}
    />
   );
}

整个错误信息是：

块引用 JSX 元素类不支持属性，因为它没有“道具”property.ts(2607) 'Cropper' 不能用作 JSX 组件。它的实例类型“Cropper”不是有效的 JSX 元素。 “Cropper”类型缺少“ElementClass”类型的以下属性：context、setState、forceUpdate、props、refsts(2786) （别名）类作物进口作物

【问题讨论】：

标签： javascript html reactjs jsx tsx

【解决方案1】：

import Cropper from "react-easy-crop";

interface CropperFix extends React.Component {}

const Cropped = (Cropper as any) as {
    new(): CropperFix;
};

const props: any = {
    cropShape: "round",
    disableAutomaticStylesInjection: true,
    image,
    crop,
    zoom,
    aspect: 1,
    onCropChange: setCrop,
    onZoomChange: setZoom,
    onCropComplete: onCropComplete,
}

...

<Cropped ...props/>

可能很难看，但有效

【讨论】：

任何澄清？它的作用以及如何解决类似问题？