HarmonyOS鸿蒙Next中 Lottie 动画偶尔不展示、随机空白，请问如何解决？

未复现问题，使用以下可以正常加载Lottie 动画，您也可以参考：lottie使用示例，还是不行的话可以提供下复现问题的demo嘛

import lottie, { AnimationItem } from '@ohos/lottie';
import { ComponentContent } from '@kit.ArkUI';
import { BusinessError } from '@kit.BasicServicesKit';

@Builder
function buildLottie(param: Params) {
  Column() {
    // 关联画布
    Canvas(param.canvas)
      .width(200)
      .height(200)
      .backgroundColor('rgba(247, 206, 0, 0.11)')
      .onReady(() => {
        param.loadAnimation();
      });
  }
  .backgroundColor(Color.Pink)
  .width(100)
  .height(100)
  .alignItems(HorizontalAlign.Center)
  .justifyContent(FlexAlign.Center);
}

class Params {
  canvas: CanvasRenderingContext2D;
  loadAnimation: () => void = () => {
  };

  constructor(canvas: CanvasRenderingContext2D, loadAnimation: () => void) {
    this.canvas = canvas;
    this.loadAnimation = loadAnimation;
  }
}

@Entry
@Component
struct LottiePage {
  canvas: CanvasRenderingContext2D = new CanvasRenderingContext2D(new RenderingContextSettings(true));
  canvas2: CanvasRenderingContext2D = new CanvasRenderingContext2D(new RenderingContextSettings(true));
  private animateItem1: AnimationItem | null = null;
  private animateItem2: AnimationItem | null = null;
  private animateName: string = 'animationName1';
  private animateName2: string = 'animationName2';
  private uiContext = this.getUIContext();
  @State contentNode1: ComponentContent<ESObject> | undefined = undefined;
  @State contentNode2: ComponentContent<ESObject> | undefined = undefined;
  @State isClose1: boolean = true;
  @State isClose2: boolean = true;
  loadAnimation1 = () => {
    this.animateItem1 = lottie.loadAnimation({
      container: this.canvas,
      renderer: 'canvas', // canvas 渲染模式
      loop: true,
      autoplay: false,
      name: this.animateName,
      contentMode: 'Contain',
      path: 'tabBar1.json',
    });
    this.animateItem1.addEventListener('DOMLoaded', (): void => {
      this.animateItem1!.changeColor([225, 25, 100, 1]);
      this.animateItem1!.play();
    });
  };
  loadAnimation2 = () => {
    this.animateItem2 = lottie.loadAnimation({
      container: this.canvas2,
      renderer: 'canvas', // canvas 渲染模式
      loop: true,
      autoplay: false,
      name: this.animateName2,
      contentMode: 'Contain',
      path: 'tabBar3.json',
    });
    this.animateItem2.addEventListener('DOMLoaded', (): void => {
      this.animateItem2!.changeColor([225, 25, 100, 1]);
      this.animateItem2!.play();
    });
  };

  build() {
    Column({ space: 8 }) {
      Button('openLottieDialog')
        .enabled(this.isClose1 && this.isClose2)
        .onClick(() => {
          this.isClose1 = false;
          this.isClose2 = false;
          let promptAction = this.uiContext.getPromptAction();
          this.contentNode1 =
            new ComponentContent(this.uiContext, wrapBuilder(buildLottie),
              new Params(this.canvas, this.loadAnimation1));
          this.contentNode2 =
            new ComponentContent(this.uiContext, wrapBuilder(buildLottie),
              new Params(this.canvas2, this.loadAnimation2));
          try {
            promptAction.openCustomDialog(this.contentNode1, {
              isModal: false,
              offset: { dx: 0, dy: -120 },
              onDidDisappear: () => {
                this.animateItem1!.removeEventListener('DOMLoaded');
                lottie.destroy(this.animateName);
                this.animateItem1 = null;
              }
            });
            promptAction.openCustomDialog(this.contentNode2, {
              isModal: false,
              offset: { dx: 0, dy: 100 },
              onDidDisappear: () => {
                this.animateItem2!.removeEventListener('DOMLoaded');
                lottie.destroy(this.animateName2);
                this.animateItem2 = null;
              }
            });
          } catch (error) {
            let message = (error as BusinessError).message;
            let code = (error as BusinessError).code;
            console.error(`OpenCustomDialog args error code is ${code}, message is ${message}`);
          }
          ;
        });
      Button('closeLottieDialog1').onClick(() => {
        if (this.contentNode1) {
          console.info('关闭弹窗1');
          this.uiContext.getPromptAction().closeCustomDialog(this.contentNode1);
          this.isClose1 = true;
        }
      });
      Button('closeLottieDialog2').onClick(() => {
        if (this.contentNode2) {
          console.info('关闭弹窗2');
          this.uiContext.getPromptAction().closeCustomDialog(this.contentNode2);
          this.isClose2 = true;
        }
      });
    }
    .width('100%')
    .alignItems(HorizontalAlign.Center);
  }
}

【背景知识】

• Canvas：提供画布组件，用于自定义绘制图形。
• CanvasRenderingContext2D：使用CanvasRenderingContext2D在Canvas画布组件上进行绘制，绘制对象可以是矩形、文本、图片等。
• lottie：适用于OpenHarmony的动画库，它可以解析json格式的动画，并在移动设备上进行本地渲染。