首先第一步當(dāng)然是安裝了：
npm install qrcodejs2 --save，（有淘寶鏡像的可以用cnpm進(jìn)行安裝）；
第二步：引入，哪個(gè)頁(yè)面用到，在哪個(gè)頁(yè)面引入
import QRCode from 'qrcodejs2';
然后直接用就可以了，
<template>
<div id="qrcode"></div>
</template>
然后在method寫入方法，一定要記住上面的id名和下面的參數(shù)名保持一致，就是我加粗的部分了
qrcode() {
? ? ? const qrcode = new QRCode('qrcode', {
? ? ? ? text: this.codeValue,
? ? ? ? colorDark: '#000',
? ? ? ? colorLight: '#fff',
? ? ? });
? ? }
最關(guān)鍵的一點(diǎn)，一定要在nextTick里面調(diào)用
this.$nextTick(() => {
? ? ? ? ? this.qrcode();
? ? ? ? });
如果你還是報(bào)錯(cuò)，報(bào)錯(cuò)還是這樣的Error in nextTick: "TypeError: Cannot read property 'appendChild' of null"
那你就看看?this.qrcode();是在什么時(shí)候調(diào)用的，調(diào)用的時(shí)候dom 節(jié)點(diǎn)生成了嗎？？
解決辦法，就是生成dom 節(jié)點(diǎn)之后在調(diào)用
舉個(gè)例子：
這個(gè)是在打開dialog框之后再調(diào)用這個(gè)方法的，用watch監(jiān)聽一下，保證是在打開dialog框之后調(diào)用
watch: {
? ? dialogVisible(val) {
? ? ? if (val) {
? ? ? ? this.$nextTick(() => {
? ? ? ? ? this.qrcode();
? ? ? ? });
? ? ? }
? ? }
? },
小伙伴們你們學(xué)會(huì)了嗎？有問(wèn)題請(qǐng)留言哦
