shizhong-miniprogram/src/pages/article/index.ts

const _app = getApp<IAppOption>();

Page({
  data: {
    show: false,

    progress: 0,
    url: 'http://m10.music.126.net/20241126110303/3f2481d2d6d50acd2009359539eadda0/ymusic/5353/0f0f/0358/d99739615f8e5153d77042092f07fd77.mp3',
    play: false,
    time: '00:01/00:00',
  },
  innerAudioContext: null as WechatMiniprogram.InnerAudioContext | null,
  onLoad() {
    this.innerAudioContext = wx.createInnerAudioContext();
  },
  onUnload() {
    if (this.innerAudioContext) {
      this.innerAudioContext?.stop();
      this.innerAudioContext.destroy();
    }
  },
  handlePlay() {
    const { url, play } = this.data;
    if (this.innerAudioContext) {
      if (play) {
        this.innerAudioContext.stop();
        return;
      }
      this.innerAudioContext.stop();
      this.innerAudioContext.src = url;
      this.innerAudioContext.play();
      this.setData({
        play: true,
      });
      const listener = () => {
        if (this.innerAudioContext) {
          const { currentTime, duration } = this.innerAudioContext;
          const time = `${this.formatTime(currentTime)}/${this.formatTime(duration)}`;
          const progress = (currentTime / duration) * 100;
          this.setData({
            time,
            progress,
          });
        }
      };
      this.innerAudioContext.onTimeUpdate(listener);
      this.innerAudioContext.onEnded(() => {
        this.setData({
          play: false,
        });
      });
      this.innerAudioContext.onStop(() => {
        this.setData({
          play: false,
        });
      });
    }
  },
  handlePause() {
    if (this.innerAudioContext) {
      this.innerAudioContext.pause();
      this.setData({
        play: false,
      });
    }
  },
  formatTime(time: number) {
    const minutes = Math.floor(time / 60);
    const seconds = Math.floor(time % 60);
    return `${minutes < 10 ? `0${minutes}` : minutes}:${seconds < 10 ? `0${seconds}` : seconds}`;
  },
  onClose() {
    this.setData({
      show: false,
    });
  },
});

export {};