I'm using react-signature-canvas for Signature Pad but signature disappear after i close and reopen the modal. is there a possible way to preserve the signature on the modal after its closed ?
i've tried by initializing useRef() on higher component and passing to Modal component
Expected behavior
signature to preserve on modal close
I created this live running example to illustrate the problem:
Any feedback about this issue ?
You just need to store signature data on save. And set the initial state of SignaturePad on handleClickOpen. Something like this
const [pointsArray, setPointsArray] = React.useState(null);
const save = () => {
setPointsArray(sigCanvas.current.toData());
setImageURL(sigCanvas.current.getTrimmedCanvas().toDataURL("image/png"));
};
const handleClickOpen = () => {
setOpen(true);
setTimeout(() => {
if (pointsArray) {
sigCanvas.current.fromData(pointsArray);
}
});
};