javascript - Vue - 响应式媒体 .readyState

Question

使用 Vue.js，我想将音频 dom 元素的 readyState 属性用作 react 属性。

我在组件中有音频元素并使用 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;
};