Canvas2D

  <canvas 
      
       id="canvas"
            type="2d"
            style="margin:5px;border:1px solid #d3d3d3"  
            @touchstart="start"  
            @touchmove="move"
            @touchend="end"
        ></canvas>
需要标记id如果用select

  wx.createSelectorQuery()
      .select('#canvas')
      .fields({
        node: true,
        size: true,
      })
      .exec((res)=> {
	console.log(res)})

  <div>
        画布

        <canvas 
         canvas-id="firstCanvas"
            id="canvas"
            type="2d"
            style="margin:5px;border:1px solid #d3d3d3"  
            @touchstart="start"  
            @touchmove="move"
            @touchend="end"
        ></canvas>
        <p v-if="show">
             Coordinates: ({{x}}, {{y}})
        </p>
  <image src="../../static/images/10.jpg" alt=""  @click="draw" id="img"/>



  methods:{
        start:function(e){
           this.show = true
            this.x = e.mp.touches[0].x
              this.y = e.mp.touches[0].y
            console.log("start",e)    
        },
        move:function(e){
            this.x = e.mp.touches[0].x
              this.y = e.mp.touches[0].y
             console.log("move",e)   

        },
        end:function(e){
            this.show = false
             console.log("end",e)   

        },
        draw(){
            //   const query = wx.createSelectorQuery()
              
                 
                
                 
               wx.createSelectorQuery().select('#canvas')
               .fields({ node: true, size: true })
               .exec((res) => {
                const canvas = res[0].node
                const ctx = canvas.getContext('2d')

                const dpr = wx.getSystemInfoSync().pixelRatio
                canvas.width = res[0].width * dpr
                canvas.height = res[0].height * dpr
                ctx.scale(dpr, dpr)

                ctx.fillRect(0, 0, 50, 50)
            
                     
                  const image = canvas.createImage()
                      image.src ="../../static/images/10.jpg"
                image.onload = function(){
                     ctx.drawImage(image, 60, 10, 150, 100)
                  }
               
            })
  
        }
    }

点击图片开始画