二维码越来越普及，我们现在经常需要为网站或应用生成二维码，但是在前端实现这个功能并不容易。好在现在有很多成熟的 npm 包可以帮我们轻松搞定，其中 browser-qr-js 就是一个很好用的生成二维码的工具。
安装
安装很简单，只需要在终端里执行：
--- ------- -------------
使用
在代码中引入：
----- -- - -------------------------
然后可以调用 Qr.generateQR() 方法来生成二维码。
----- ------ - --------------------- ---------
以上代码会生成一个包含 hello, world! 内容的二维码。可以将这个二维码展示在页面上，比如将它作为 src 属性赋值给一个 img 标签。
---- ----------------------------
高级用法
browser-qr-js 还提供了很多选项，可以让你自定义生成的二维码。
选择 ECC 纠错等级
ECC 纠错等级从 L（7%）到 H（30%）不等。高等级的纠错能力意味着二维码可以被破坏或部分损坏，但仍然能被扫描识别出来。默认情况下是 M，即 15% 的纠错能力。
----- -- - --------------------- -------- - --------- --- --- -- ------- -
选择二维码尺寸
默认的尺寸是 400x400，但是可以通过 size 选项修改二维码尺寸。
----- -- - --------------------- -------- - ----- --- --- -- --- ------- ---
自定义颜色和背景色
color 和 bgcolor 选项被用来修改生成的二维码的颜色和背景色。
----- -- - --------------------- -------- - ------ ---------- -------- --------- --- -- -----------------
生成方式
browser-qr-js 提供了两种生成方式，canvas 和 svg。默认使用 canvas。
----- -- - --------------------- -------- - ----- ----- --- -- -- --- --
示例代码
--------- -----
----- ----------
------
----- ----------------
-------------------- ------------
-------
------
------- -----------------------------------------------------------------------------------------------
--------
----- -- - --------------
----- -- - --------------------- ---------
----- --- - ------------------------------
------- - ---------------
-------------------------------
---------
-------
-------以上代码会在页面上生成一个包含 hello, world! 内容的二维码。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/60066c89ccdc64669dde51a6