组件中有会新建audio对象，页面通过v-if调用该组件时，第二次调用会无法触发audio的onCanPlay监听

RT，

页面

<recordingVoice :recordingVoiceShow.sync="recordingVoiceShow" :recordingUrl.sync="recordingUrl"></recordingVoice>  

<playVoice v-if="(this.recordingUrl == '')?false:true" class="recordingSoundsPath" playType="user" :path.sync="recordingUrl" :recordingTrans.sync="recordingTranslation"></playVoice>

组件

watch: {  
        path: {  
            immediate: true,  
            handler: function(newVal) {  
                if (newVal) {  
                    console.log(newVal)  
                    this.voicePath = newVal;  
                    this.innerAudioContext.src = newVal;  
                    //音频时长  
                    this.innerAudioContext.onCanplay(() => {  
                        console.log(this.innerAudioContext.duration);  
                        this.allTime = 0;  
                        this.allTime = this.timeChange(this.innerAudioContext.duration.toFixed(0));  
                    });  
                }  
            }  
        }  
    },  
// //确认删除  
        sureDele() {  
            this.showDel = false;  
            //给父组件删除音频  
            this.$emit('update:path', '');  
            this.innerAudioContext.destroy();  
        },