Vue - 反应式媒体 .readyState

Question

使用 Vue.js，我想使用音频 dom 元素的 readyState 属性作为反应属性。

我在组件中有音频元素，并使用 this.$refs.audioPlayer 访问它

我尝试设置一个计算属性来返回该属性：

audioLoaded(){
    if(this.$refs.audioPlayer){
        return this.$refs.audioPlayer.readyState;
    }
    return false;
}

这只是返回初始状态（0），当媒体加载时，这应该变为4。

有没有办法让它成为反应属性？

Answer 1

我通过添加一个名为 audioLoaded 的属性来解决这个问题，该属性在创建组件时设置为 false。

mounted 中的这个函数在音频准备好时将其设置为 true：

var self = this;
this.audioPlayer.oncanplay = function(){
    self.audioLoaded = true;
};