vuejs with HTML5 audio property
<p>I'm using Vuejs to make a control panel for audio, I want to get the <code>currentTime</code> property bind to a <code>computed</code> value, so I write</p>

<pre><code>  computed: {
    'currentTime': {
      cache: false,
      get: function () {
        return document.getElementById('player').currentTime
      }
    }
  },
</code></pre>

<p>and here is my <code>audio</code> tag:</p>

<pre><code>  &lt;audio :src="musicSrc" preload="auto" id="player"&gt;
    &lt;p&gt;Your browser does not support the &lt;code&gt;audio&lt;/code&gt; element.&lt;/p&gt;
  &lt;/audio&gt;
</code></pre>

<p>I can get it in <code>ready</code>:</p>

<pre><code>  ready () {
    this.player = document.getElementById('player')
  },
</code></pre>

<p>I can control it in <code>methods</code></p>

<pre><code>play: function () {
  this.player.play()
},
</code></pre>

<p>But when I use <code>{{ currentTime }}</code> in template I got </p>

<blockquote>
  <p>Error when evaluating expression "currentTime". </p>
  
  <p>Uncaught TypeError: Cannot read property 'currentTime' of null</p>
</blockquote>