小程序二维码怎么生成
-
2023年2月19日发(作者：)微信⼩程序动态⽣成⼆维码的实现代码
效果图如下：
实现
wxml
wxss
.container{
display:flex;
align-items:center;
justify-content:center;
width:100%;
height:100%;
}
.containerimage{
width:686rpx;
height:686rpx;
background-color:#f9f9f9;
}
.canvas-box{
position:fixed;
top:999999rpx;
left:0;
}
js
varQR=require(\"../../../lib/\");
Page({
/**
*页⾯的初始数据
*/
data:{
canvasHidden:false,
imagePath:\'\',
},
/**
*⽣命周期函数--监听页⾯加载
*/
onLoad:function(options){
//option为上个页⾯传递过来的参数
varjiaoyanCode=\'sorry,jiaoyanCodeisloss\';
if(options){
jiaoyanCode=nCode;
}
(jiaoyanCode);
varsize=vasSize();//动态设置画布⼤⼩
QrCode(jiaoyanCode,\"mycanvas\",size.w,size.h);
},
//适配不同屏幕⼤⼩的canvas
setCanvasSize:function(){
varsize={};
try{
varres=temInfoSync();
varscale=750/686;//不同屏幕下canvas的适配⽐例；设计稿是750宽686是因为样式wxss⽂件中设置的⼤⼩
varwidth=Width/scale;
varheight=width;//canvas画布为正⽅形
size.w=width;
size.h=height;
}catch(e){
//Dosomethingwhencatcherror
(\"获取设备信息失败\"+e);
}
returnsize;
},
/**
*绘制⼆维码图⽚
*/
createQrCode:function(url,canvasId,cavW,cavH){
//调⽤插件中的draw⽅法，绘制⼆维码图⽚
(url,canvasId,cavW,cavH);
setTimeout(()=>{
ToTempImage();
},1000);
},
/**
*获取临时缓存照⽚路径，存⼊data中
*/
canvasToTempImage:function(){
varthat=this;
//把当前画布指定区域的内容导出⽣成指定⼤⼩的图⽚，并返回⽂件路径。
ToTempFilePath({
canvasId:\'mycanvas\',
success:function(res){
vartempFilePath=lePath;
(tempFilePath);
a({
imagePath:tempFilePath,
//canvasHidden:true
});
},
fail:function(res){
(res);
}
});
},
/**
*点击图⽚进⾏预览
*/
previewImg:function(e){
varimg=ath;
(img);
wImage({
current:img,//当前显⽰图⽚的http链接
urls:[img]//需要预览的图⽚http链接列表
});
},
})
可以去这⾥下载。
总结
以上所述是⼩编给⼤家介绍的微信⼩程序动态⽣成⼆维码的实现代码，希望对⼤家有所帮助，如果⼤家有任何疑问请给我留
⾔，⼩编会及时回复⼤家的。在此也⾮常感谢⼤家对⽹站的⽀持！