小编Mik*_*iko的帖子

使用 div React useRef 钩子,打字稿?

我正在使用 qrcode.react 库并创建 useRef 挂钩

const qrRef = React.useRef();
Run Code Online (Sandbox Code Playgroud)

然后使用它

const downloadQRCode = (evt: React.FormEvent) =>{
        evt.preventDefault();

        // @ts-ignore
        let canvas = qrRef.current.querySelector("canvas");
        let image = canvas.toDataURL("image/png");
        let anchor = document.createElement("a");
        anchor.href = image;
        anchor.download="qr-code.png";
        document.body.appendChild(anchor);
        anchor.click();
        document.body.removeChild(anchor);
        
        setUrl("");
    };
<div className="qr-container">
    <form onSubmit={downloadQRCode} className="qr-container_form">
       <input
         type="text"
         value={url}
         onChange={(e) => setUrl(e.target.value)}
         placeholder="https://example.com"
       />
       <button type="submit">Download QR Code</button>
    </form>
    <div className="qr-container_qr-code" ref={qrRef}>{qrCode}</div>
</div>
Run Code Online (Sandbox Code Playgroud)

我收到这个错误

Type 'MutableRefObject<undefined>' is not assignable to type 'LegacyRef<HTMLDivElement> | undefined'.
  Type 'MutableRefObject<undefined>' is not assignable to type …
Run Code Online (Sandbox Code Playgroud)

typescript reactjs react-hooks

4
推荐指数
1
解决办法
6831
查看次数

标签 统计

react-hooks ×1

reactjs ×1

typescript ×1