@nicolaz/qrcode

跨浏览器的 JavaScript 版 QRCode 生成库。Fork 自 QRcode，使其支持 ESM 环境。

安装

npm i @nicolaz/qrcode

使用

import QRCode from '@nicolaz/qrcode';

原生 JavaScript 中

new QRCode(document.getElementById('qrcode'), 'http://www.baidu.com');

React

function QRCode({ url }) {
  const el = useRef(null);
  useEffect(() => {
    new QRCode(el.current, url);
  }, []);

  return (
    <div ref={el} className="qrcode" />
  );
}

API

构造函数参数

Element

Type: HTMLElement | String

如果是 String 则认为是元素的 ID 选择器

Options

Type: Object | String

如果是 Object 则认为是一个配置对象：

属性	描述	默认值
text	QRCode 数据源
width	渲染宽度	256
height	渲染高度	256
colorDark	前景色	"#000000"
colorLight	背景色	"#ffffff"
correctLevel	容错级别	QRCode.correctLevel.H

QRCode.correctLevel

• QRCode.correctLevel.L
• QRCode.correctLevel.M
• QRCode.correctLevel.Q
• QRCode.correctLevel.H

实例方法

qrcode.clear()

清除 QR code

qrcode.makeCode(text)

重新渲染另一个 QR code

License

MIT © nicolaszhao