怎么获取表格中勾选的音频总时长?

内容代码为
问题一:

<el-table :data="tableData" @selection-change="handleSelect" ref="taskTableRef">

<el-table-column type="selection" />

<el-table-column align="center" prop="fileName" width="218"/>

<el-table-column align="center" label="片头试听">

<template #default="scope">

<audio style="height:20px" controls :ref="audioRef">

<source :src="scope.row.url" type="audio/ogg"/>

<source :src="scope.row.url" type="audio/mpeg"/>

您的浏览器不支持音频元素.

</audio>

</template>

</el-table-column>

</el-table>

方法:

import { reactive, toRefs,ref ,watch,getCurrentInstance,onMounted} from 'vue'

const state = reactive({

tableData:[

{fileName:'渔舟唱晚',url:'/src/assets/audio/渔舟唱晚.mp3',},

{fileName:'月光下的凤尾竹',url:'/src/assets/audio/月光下的凤尾竹.mp3',}

],

infor:{

musicData:[] as any,

duration:'' as any

}

})

const taskTableRef = ref(null)

const boxRefs = ref<HTMLElement[]>([])

const audioRef = (el: any) => {

if (el) {

boxRefs.value.push(el)

}

}

const handleSelect = ( selection: any, row: any ) =>{

state.infor.musicData = selection

if (selection.length > 1) {

let del_row = selection.shift();

taskTableRef.value.toggleRowSelection(del_row, false);

}

boxRefs.value.filter( (item:any) =>{

if(item.currentSrc.includes(state.infor.musicIdselect[0].url)){

state.infor.duration = item.duration

}

})

}

想在勾选时将音频总长付给 state.infor.duration

获取得了 就是路径有点问题转义了


回答:

想要获取音视频时长,那得下载下来,有点得不偿失

var audio = new Audio('url')
audio.addEventListener("loadedmetadata", function (e) {

console.log(audio.duration)

});

以上是 怎么获取表格中勾选的音频总时长? 的全部内容, 来源链接: utcz.com/p/932785.html

回到顶部