钉钉小程序组件canvas加载数据库图片

钉钉小程序canvas加载数据库图片

钉钉的文档实在是少的可怜，参照微信的勉强调试成功。

画图() {

  return new Promise((resolve, reject) => {
    const ctx = dd.createCanvasContext('canvas');
    // dd.createSelectorQuery() 获取一个节点查询对象 SelectorQuery;
    // selectorQuery.select(selector) 选择当前第一个匹配选择器的节点，选择器支持 id 选择器以及 class 选择器
    // selectorQuery.boundingClientRect() 将当前所选择节点的位置信息放入查询结果，返回对象包含 width/height/left/top/bottom/right
    // selectorQuery.exec(callback) 将查询结果放入 callback 回调中。查询结果为数组，每项为一次查询的结果，如果当前是节点列表，则单次查询结果也为数组。注意 exec 必须放到onReady函数里调用
    dd.createSelectorQuery().select("#canvas").boundingClientRect().exec(res => {

      let w = res[0].width; // canvas元素的宽
      let h = res[0].height;  // canvas元素的高
      var sw = w * this.data.scale
      var sh = h * this.data.scale

ctx.drawImage(this.data.url, 0, 0, sw, sh)
ctx.draw()
})

    /* ctx.toTempFilePath({
       success(res) {
         resolve(res.filePath)
       }
     });,*/

  });
},

加载(n) {
  var that = this
  dd.editPicture({
    url: that.data.jm[n].fpath,// app.globaldata.url 
    success: function (res) {
      that.data.url = res.path
      that.画图().then((res) => {
        console.log(res);// http://resource/******.image
      });
    },
    fail: function (e) {
      console.log(e)
    }
  });


}
,