html52.com
我爱小程序-开发者交流社区

wx.canvasToTempFilePath输出图片分享显示一半

问题模块 框架类型 问题类型 API/组件名称 终端类型 微信版本 基础库版本
API和组件 小程序 Bug wx.canvasToTempFilePath 客户端 6.7.3 1.9.95

- 当前 Bug 的表现(可附上截图)

- 当前 Bug 的表现(可附上截图)- 预期表现


- 预期表现

- 预期表现- 复现路径


- 复现路径

canvas画图,然后分享

- 提供一个最简复现 Demo


网友回复

QQ:

$data: {
 time: null,
 imageUrl: '',
 goodsImg: ''
},



wx.getImageInfo({

 src: `${res.body.spuImages[0]}?imageView2/1/w/500/h/400`,

 success: res => {

    this.$data.goodsImg = res.path
   this.drawImg()
 }

})



drawImg () {
 wx.createSelectorQuery().select('.canvas-img').boundingClientRect(() => {
   // 获取图片信息
   ctx.drawImage(this.$data.goodsImg, 0, 0, getPx(375), getPx(300))

   // 绘制底部背景
   ctx.drawImage('/images/shareBottomBg.png', getPx(0), getPx(225), getPx(375), getPx(75))

   ctx.draw()
 }).exec()
 this.$data.time = setTimeout(this.checkCanvas, 1000)
},
checkCanvas () {
 clearTimeout(this.$data.time)
 wx.canvasToTempFilePath({
   canvasId: 'myCanvas',
   success: res => {

     if (res.tempFilePath) {

       this.$data.imageUrl = res.tempFilePath
     }
   }
 })
},
// 分享设置
onShareAppMessage () {
 let path = `***********`
 return {
   title: ***,
   path: path,
   imageUrl: this.$data.imageUrl,
   success: function (res) {
     // 转发成功
   },
   fail: function (res) {
     // 转发失败
   }
 }
},



卢霄霄:

片段片段,代码片段,交出来。。

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

真正的个人免签约支付接口

云免签H5支付