具有HTML5音频属性的vuejs [英] vuejs with HTML5 audio property
本文介绍了具有HTML5音频属性的vuejs的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正在使用Vuejs为音频制作控制面板,我想将 currentTime
属性绑定到计算
值,所以我写
I'm using Vuejs to make a control panel for audio, I want to get the currentTime
property bind to a computed
value, so I write
computed: {
'currentTime': {
cache: false,
get: function () {
return document.getElementById('player').currentTime
}
}
},
这是我的音频
标签:
<audio :src="musicSrc" preload="auto" id="player">
<p>Your browser does not support the <code>audio</code> element.</p>
</audio>
我可以在准备就绪
:
ready () {
this.player = document.getElementById('player')
},
我可以用方法控制它
play: function () {
this.player.play()
},
但是当我在模板中使用 {{currentTime}}
时,我得到了
But when I use {{ currentTime }}
in template I got
评估表达式currentTime时出错。
Error when evaluating expression "currentTime".
未捕获的TypeError:无法读取null的属性'currentTime'
Uncaught TypeError: Cannot read property 'currentTime' of null
推荐答案
对于vue 2.0,引用元素的方式已经改变。
For vue 2.0 the way to reference an element has changed.
在HTML中
< audio ref =audiocontrols>
在Vuejs
this.currentTime = this。$ refs.audio.currentTime
这篇关于具有HTML5音频属性的vuejs的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文