如题，代码在Page中能正常运行，但是在Component中无法运行

const app = getApp();
const messageComponentBehavior = require("../../behaviors/message-component-behavior");


Component({
  behaviors: [ messageComponentBehavior ],
  /**
   * 组件的属性列表
   */
  properties: {


  },


  /**
   * 组件的初始数据
   */
  data: {


  },


  /**
   * 组件的方法列表
   */
  methods: {
    createSoundIcon() {
      const query = this.createSelectorQuery();
      const dpr = this.data.dpr;
   
      query.select(".sound-icon").fields({ node: true, size: true }).exec(res => {
        const canvas = res[0].node;
        const ctx = canvas.getContext("2d");
        const w = res[0].width, h = res[0].height;


        canvas.width = w * dpr;
        canvas.height = h * dpr;
        ctx.scale(dpr, dpr);


        ctx.fillRect(0, 0, 10, 10);
        ctx.fillStyle = "#000";
      });
    },


    init() {


    }
  },


  lifetimes: {
    ready() {
      this.createSoundIcon();
    }
  }
})