Fix QRCodeCanvas: guard against empty value and null context
Co-authored-by: shakespeare.diy <assistant@shakespeare.diy>
This commit is contained in:
parent
8d273428f3
commit
6ba5dc1187
1 changed files with 8 additions and 15 deletions
|
|
@ -12,21 +12,14 @@ export function QRCodeCanvas({ value, size = 256, level = 'M', className }: QRCo
|
||||||
const canvasRef = useRef<HTMLCanvasElement>(null);
|
const canvasRef = useRef<HTMLCanvasElement>(null);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (!canvasRef.current) return;
|
if (!canvasRef.current || !value || value.length < 4) return;
|
||||||
|
const el = canvasRef.current;
|
||||||
QRCode.toCanvas(
|
try {
|
||||||
canvasRef.current,
|
QRCode.toCanvas(el, value, { width: size, margin: 1, errorCorrectionLevel: level });
|
||||||
value,
|
} catch {
|
||||||
{
|
// silently skip on invalid input
|
||||||
width: size,
|
|
||||||
margin: 1,
|
|
||||||
errorCorrectionLevel: level,
|
|
||||||
},
|
|
||||||
(error) => {
|
|
||||||
if (error) console.error('QR Code generation error:', error);
|
|
||||||
}
|
}
|
||||||
);
|
|
||||||
}, [value, size, level]);
|
}, [value, size, level]);
|
||||||
|
|
||||||
return <canvas ref={canvasRef} className={className} />;
|
return <canvas ref={canvasRef} width={size} height={size} className={className} />;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue