html部分

<canvas style="width: 100%;height: 450px; " canvas-id="firstCanvas"></canvas>
<img :src="imgSrc" :show-menu-by-longpress='true' class="new-image" alt="">

js部分

    generateImage() {
                const that=this;
                const ctx = wx.createCanvasContext('firstCanvas')
                ctx.drawImage('../../static/img/old-img.jpg', 0, 0, 200, 200)
                ctx.setFontSize(12)
                ctx.fillText('正方', 5, 5)
                ctx.fillText('反方', 10, 10)
                ctx.draw(true, (ret) => {
                    setTimeout(() => {
                        uni.canvasToTempFilePath({
                            canvasId: 'firstCanvas',
                            fileType: 'png',
                            quality: 1, //圖片質(zhì)量
                            success(res) {
                                console.log(res.tempFilePath)
                                that.imgSrc = res.tempFilePath;
                            }
                        })
                    })
                })

                // uni.getImageInfo({
                //  src: "http://game.gtimg.cn/images/yxzj/act/a20160510story/relavance/heroes/hero48.jpg",
                //  success(res) {
                //      console.log(res.path) 
                //      var ctx = uni.createCanvasContext(
                //          "firstCanvas") // 使用畫布創(chuàng)建上下文 圖片
                //      ctx.drawImage(res.path, x, y, 100, 100) // 設(shè)置圖片坐標(biāo)及大小，括號里面的分別是（圖片路徑，x坐標(biāo)，y坐標(biāo)，width，height）
                //      ctx.save(); //保存
                //      ctx.draw() //繪制

                //      // ctx.fillText("內(nèi)容", 240, 40); //文字內(nèi)容、x坐標(biāo)，y坐標(biāo)
                //      // ctx.font = 'normal 20px STXingkai'; // 字體
                //      // ctx.setFontSize(10) //設(shè)置字體大小，默認(rèn)10
                //      // ctx.setFillStyle('#DD524D') //文字顏色：默認(rèn)黑色
                //      // ctx.fillText("width:" + ctx.measureText(that.sent[0]).width, 50, 50) //顯示文字寬度
                //  }
                // })
            },