reactjssignaturepad

Using SignaturePad in ReactJS


Does anyone has experience in using SignaturePad in React?

I realise that the example is using DOM which I can try to replicate with Ref in react, but it doesn't seem very natural and I can't see any example online of using it in React.

Can anyone help?

Thanks


Solution

  • The way to access DOM in react is using Refs

    You can either use React.createRef() or use React hooks with useRef

    Then you can call your ref to the canvas like this:

    const myRef = useRef(null);
    
    useEffect( () => { myRef.current.doSomething() });
    
    return(
      <canvas ref={myRef}> </canvas>
    )