小程序innerAudioContext问题

最近在准备做一个录音倒放小程序的时候，遇到了点问题，就在这里做一下笔记，踩一下坑。
我这里采用的是基于vue开发的uniapp的前端框架来开发小程序。uniapp里面也集成封装了微信小程序的API接口，只需要把之前的wx.createInnerAudioContext()的wx，替换成uni就可以使用相同的API。
对比一下差别：详情可以参考uniapp的官方文档、小程序的官方文档

    //uniapp
    methods: {
        clickPlay(){
            const innerAudioContext = uni.createInnerAudioContext();
            innerAudioContext.autoplay = true;
            innerAudioContext.src = 'https://img-cdn-qiniu.dcloud.net.cn/uniapp/audio/music.mp3';
            innerAudioContext.onPlay(() => {
              console.log('开始播放');
            });
            innerAudioContext.onError((res) => {
              console.log(res.errMsg);
              console.log(res.errCode);
            });
        },
    }

    //wx
    methods: {
        clickPlay() {
            const innerAudioContext = wx.createInnerAudioContext();
            innerAudioContext.autoplay = true;
            innerAudioContext.src =
                'http://ws.stream.qqmusic.qq.com/M500001VfvsJ21xFqb.mp3?guid=ffffffff82def4af4b12b3cd9337d5e7&uin=346897220&vkey=6292F51E1E384E061FF02C31F716658E5C81F5594D561F2E88B854E81CAAB7806D5E4F103E55D33C16F3FAC506D1AB172DE8600B37E43FAD&fromtag=46';
            innerAudioContext.onPlay(() => {
                console.log('开始播放');
            });
            innerAudioContext.onError(res => {
                console.log(res.errMsg);
                console.log(res.errCode);
            });
        }
    }

我们使用上面的代码，每次进行点击事件调用这个方法，会不断的生成innerAudioContext实例，就会导致点一下会放一次，点两下会叠在一起，点个十几下估计会成为混沌的噪音。解决的方法就是把生成实例放在export default上面。

const innerAudioContext = uni.createInnerAudioContext();
export default {
    data() {
        return {};
    },
    onLoad() {},
    mounted() {},
    methods: {
        clickPlay() {           
            innerAudioContext.autoplay = true;
            innerAudioContext.src =
                'https://img-cdn-qiniu.dcloud.net.cn/uniapp/audio/music.mp3';
            innerAudioContext.onPlay(() => {
                console.log('开始播放');
            });
            innerAudioContext.onError(res => {
                console.log(res.errMsg);
                console.log(res.errCode);
            });
        }
    }
};

后续问题接着更新