vue下的audio标签播放、暂停、完成事件

最新推荐文章于 2024-07-17 15:34:34 发布

Avavavavavavavava

最新推荐文章于 2024-07-17 15:34:34 发布

阅读量3.3k

点赞数 2

本文链接：https://blog.csdn.net/homoiotheymy/article/details/128403832

版权

Vue.js 音频事件播放控制页面路由 JavaScript

关键词由CSDN通过智能技术生成

@play、@pause、@ended都是自带的事件，一开始不知道整了半天

<div >  
        <audio controls autoplay @play="play" @pause="pause"  @ended="audioEnded" :src="require('@/assets/Listen_material/'+imgANDaudioIndex+'.mp3')" ></audio>
    </div>

js部分

methods:{
        play(){
            this.isPlaying=true;
            console.log("running~")
        },
        pause(){
            this.isPlaying=false;
            console.log("stop!")
        },
        audioEnded(){
            console.log('end')
            Toast.success('任务完成！');
            setTimeout(() => {
                this.$router.go(-1)
              }, 2000);  
        },
    },