useQRCode

useQRCode 是一个用于生成二维码的 Hook。

Install

npm i qrcode@^1

Usage

实时编辑器

// import { useQRCode } from "@reactuses/core/useQRCode";

function Demo() {
  const [text, setText] = useState("https://reactuse.com/");
  const { qrCode, error } = useQRCode(text);

  return (
    <div>
      <input
        value={text}
        onChange={(e) => setText(e.target.value)}
        placeholder="Enter text to generate QR code"
      />
      <br />
      <br />
      {error && <div style={{ color: "red" }}>{error}</div>}
      {qrCode && <img src={qrCode} alt="QR Code" />}
    </div>
  );
}

结果

Loading...

API

UseQRCode

Returns

UseQRCodeReturn

Arguments

参数名	描述	类型	默认值
text	文本	string (必填)	-
options	传递给 QRCode.toDataURL 的选项	QRCodeToDataURLOptions | undefined	-

UseQRCodeReturn

参数名	描述	类型	默认值
qrCode	生成的二维码	string (必填)	-
error	错误	unknown (必填)	-