<template>
  <view>
    <canvas id="canvas1"></canvas>
  </view>
  <view>
    <canvas id="canvas2"></canvas>
  </view>
  <view>
    {{testCounter}}
  </view>
</template>

<script>
  export default {
    data() {
      return {
        // 仅测试
        testCounter: 0,
      }
    },
    mounted() {
      uni.createCanvasContextAsync({
        id: 'canvas1',
        component: this,
        success: (_ : CanvasContext) => {
          this.testCounter++
          this._dispatchEvent()
        }
      });
      uni.createCanvasContextAsync({
        id: 'canvas2',
        component: this,
        success: (_ : CanvasContext) => {
          this.testCounter++
          this._dispatchEvent()
        }
      });
    },
    methods: {
      _dispatchEvent() {
        if (this.testCounter == 2) {
          uni.$emit('canvasChildReady')
        }
      }
    }
  }
</script>