我创建了这段代码，它显示了以下错误：'TS2604：JSX元素类型'ReactToPrint'没有任何构造或调用签名

Question

import * as React from "react";
import { useRef } from "react";
//import parse from 'html-react-parser';
import ReactToPrint from "react-to-print";

import { IInputs } from "../generated/ManifestTypes";

import '../css/AppStyles.css';

interface IHTML2PrintComponentProps {
    appContext: ComponentFramework.Context<IInputs>
}

const HTML2PrintComponent: React.FC<IHTML2PrintComponentProps> = ({ appContext }) => {
    const componentRef = useRef(null);

    return(
        <React.Fragment>

            <ReactToPrint //(The error appears on this "reactToPrint")

                trigger={ () => <button id="btnImprimitPDF">{ appContext.parameters.ButtonText.raw }</button> }
                content={ () => componentRef.current }
            />
            <div className="pagebreak full-table">
                {/* { document.title = appContext.parameters.DefaultFilename.raw? } */}
                <div ref={ componentRef }>
                    {/* { parse(appContext.parameters.CustomCss.raw?) } */}
                </div>
            </div>
        </React.Fragment>
    );
}

export default HTML2PrintComponent;

我尝试过一些教程，但没有一个产生显着的结果。我找到的选项讨论了构造函数，但情况与此完全不同。如果你能帮助我，我将不胜感激

Answer 1

再试一次，这里是react-to-print的最新版本3.0.2：

import { useReactToPrint } from 'react-to-print';
const handlePrint = useReactToPrint({
    content: () => componentRef?.current,
    documentTitle: 'title',
    onAfterPrint: () => {}
});