1.开发环境 vue+vant
2.电脑系统 windows10专业版
3.在使用vue结合qrcode开发的过程中,我们可能会遇到以下报错:Cannot read property 'appendChild' of undefined,下面我来分享以下解决方法,希望对你有所帮助。
4.在template中添加如下代码:
5.在对应的方法中获取 ref的值:
console.log("我是ref的值");
console.log(this.$refs.cqrCodeUrl);
console.log("我是ref的值结束啦");
this.creatQrCode(this.code, this.$refs.cqrCodeUrl);
//你会发现,此时可能会报错,报错信息为:Cannot read property 'appendChild' of undefined
6.报错原因分析:
在这个方法中,里面的$refs还没有开始加载,因为是dom节点还没有渲染好,结局方法如下
7.在对应的方法中添加如下代码:
this.$nextTick(() => {
console.log("我是ref的值");
console.log(this.$refs.cqrCodeUrl);
console.log("我是ref的值结束啦");
this.creatQrCode(this.code, this.$refs.cqrCodeUrl);
})
8.本期的分享到了这里就结束啦,希望对你有所帮助,让我们一起努力走向巅峰。