Accepted answer

Seems like a known issue when using hooks:

As an alternative, you can avoid the useRef hook and follow the example in the source repo which seems to work in TypeScript:

i.e., the first example on the npm readme doc:


You can define the type for useRef to get rid of the ts error credit to shane935:

const componentRef = useRef<HTMLDivElement>(null)

And if you, like me, are using functional components you will get a problem trying to use that ref following react-to-print class based components. To bypass this error you can wrap your component you wish to print in a div:

  trigger={() => <Button variant="contained" color="primary">Generar</Button>}
  content={() => componentRef.current}
<div ref={componentRef}>
  <PrintableComponent />

Everything inside this div will be printed.

Related Query

More Query from same tag