且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

Nuxt.js引用static或者assets目录下资源

更新时间:2022-08-19 17:43:03

Node.js

安装

npm i qrcode

API

toDataURL(text, [options], [cb(error, url)])

## 参数:
text String|Array

options: {
    version Type: Number

    errorCorrectionLevel Type: String Default: M
    # low, medium, quartile, high or L, M, Q, H
    
    maskPattern Type: Number
    # 0, 1, 2, 3, 4, 5, 6, 7.

    toSJISFunc Type: Function

    type Type: String Default: image/png
    # image/png, image/jpeg, image/webp
    
    quality Type: Number Default: 0.92
    
    # Renderers options
    margin  Type: Number Default: 4
    scale   Type: Number Default: 4
    width   Type: Number
    color: {
        dark  Type: String Default: #000000ff
        light Type: String Default: #ffffffff
    }
}

cb Type: Function

使用示例

import QRCode from 'qrcode'
 
// With promises
QRCode.toDataURL('I am a pony!')
  .then(url => {
    console.log(url)
  })
  .catch(err => {
    console.error(err)
  })

生成的二维码(边框和文字是我加的)

Nuxt.js引用static或者assets目录下资源

Browser

配合jquery使用


<script src="https://cdn.jsdelivr.net/npm/qrcode/build/qrcode.min.js"></script>

<script>
$(document).ready(function () {
        QRCode.toDataURL(window.location.href, { errorCorrectionLevel: 'H' }, function (err, url) {
            // console.log('QRCode', url)
            $('#weixin-code').attr('src', url)
        })
    });
</script>