当前位置: 首页 > news >正文

微信小程序显示二维码?

wxml

 <canvas style="width: 100%;height: 100%;margin-left: 20%;" id="Canvase" type="2d"></canvas>

js

// pages/code/code.js
Page({/*** 页面的初始数据*/data: {code: '',},/*** 生命周期函数--监听页面加载*/onLoad(options) {var that = thiswx.request({url: '接口数据', //仅为示例,并非真实的接口地址data: {userid: 36,scienceid: 1,},header: {'content-type': 'application/json' // 默认值},success(res) {console.log(res);const fs = wx.getFileSystemManager();var codeimg = wx.env.USER_DATA_PATH + '/' + '.jpg';fs.writeFile({filePath: codeimg,data: res.data.slice(22), // code就是接口返回的base64数据(分割掉前面的data:image/png;base64,)encoding: 'base64',success: () => {// console.log(codeimg);wx.createSelectorQuery().select('#Canvase').fields({node: true,size: true}).exec((res) => {console.log(res);let ctx = res[0].node.getContext('2d'); //getContext返回Canvas 的绘图上下文              let canvas = res[0].node;const bg = canvas.createImage();//背景图片const image = canvas.createImage();// 图片高清化const dpr = wx.getSystemInfoSync().pixelRatio;res[0].node.width = res[0].node.width * dpr;res[0].node.height = res[0].node.height * dpr;// 设置背景图片srcimage.src = 'https://pic.imgdb.cn/item/647d31011ddac507cc160e75.jpg'bg.src = codeimg;image.onload = function () {ctx.drawImage(image, 0, 0, 289, 370)ctx.drawImage(bg, 76, 175, 140, 140);}// 将图片保存需要的实例,不写保存可以不需要that.setData({ctx: canvas})  })}})}})},/*** 生命周期函数--监听页面初次渲染完成*/onReady() {},/*** 生命周期函数--监听页面显示*/onShow() {},/*** 生命周期函数--监听页面隐藏*/onHide() {},/*** 生命周期函数--监听页面卸载*/onUnload() {},/*** 页面相关事件处理函数--监听用户下拉动作*/onPullDownRefresh() {},/*** 页面上拉触底事件的处理函数*/onReachBottom() {},/*** 用户点击右上角分享*/onShareAppMessage() {}
})

http://www.lryc.cn/news/251073.html

相关文章:

  • JavaWeb开发全流程笔记
  • LLM;超越记忆《第 2 部分 》
  • Python中的加法测试题实现
  • 使用gcloud SDK 管理和部署 Cloud run service
  • JS逆向-mytoken之code参数
  • 第九节HarmonyOS 常用基础组件4-Button
  • 常用数据预处理方法 python
  • 【无标题】AttributeError: module ‘gradio‘ has no attribute ‘outputs‘
  • 无人机助力电力设备螺母缺销智能检测识别,python基于YOLOv7开发构建电力设备螺母缺销小目标检测识别系统
  • 动态页面技术的发展与应用
  • 1-算法基础-编程基础
  • HarmonyOS应用开发——程序框架UIAbility、启动模式与路由跳转
  • node.js-连接SQLserver数据库
  • 目标检测YOLO系列从入门到精通技术详解100篇-【图像处理】图像预处理方法
  • Android drawable layer-list右上角红点,xml布局实现,Kotlin
  • 网络虚拟化场景下网络包的发送过程
  • 《数据结构与测绘程序设计》试题详细解析(仅供参考)
  • Raft 算法
  • Redis队列stream,Redis多线程详解
  • ThinkPHP的方法接收json数据问题
  • 简单理解算法
  • C/C++ 内存管理(2)
  • Net6.0或Net7.0项目升级到Net8.0 并 消除.Net8中SqlSugar的警告
  • 力扣题:字符串的反转-11.22
  • Effective C++(二):对象的初始化
  • 云原生高级--shell自动化脚本备份
  • Spring Boot实现热部署
  • MVCC-
  • 键盘打字盲打练习系列之刻意练习——1
  • 某公司前端笔试题(12.30)