Vue中的audio組件是用來播放音頻的UI組件，其中duration屬性可以獲取音頻的總時長，下面是一個使用Vue audio組件和duration屬性的簡單示例：

<template>
<div>
<audio ref="audio" src="your_audio_file"></audio>
{{ duration }}
</div>
</template>
<script>
export default {
data() {
return {
duration: 0
}
},
mounted() {
this.$refs.audio.addEventListener('loadedmetadata', () =>{
this.duration = this.$refs.audio.duration;
});
}
}
</script>

在上面的代碼中，我們定義了一個data屬性“duration”，然后在mounted鉤子中，我們為音頻組件的“loadedmetadata”事件添加了一個監聽器，監聽audio的元數據是否已加載完成。如果元數據已加載完成，我們就可以使用Vue的ref屬性引用到這個audio組件，并通過“duration”屬性獲取音頻的總時長。

需要注意的是，“loadedmetadata”事件不會在音頻的實際播放過程中被觸發，而是在音頻開始加載時觸發。因此，我們可以把獲取duration的代碼寫在mounted鉤子中，確保在音頻元數據加載完成后立即獲取。