kenpeter kenpeter -4 years ago 226
Node.js Question

Cannot read property 'duration' of undefined?

Full code: https://github.com/kenpeter/test_vue_simple_audio_2

In Main.vue

I tried to assign new value to

this.player.currentTrack
, by following this guide.

selectTrack: function selectTrack(id) {
this.player.currentTrack = Object.assign(
{},
this.player.currentTrack,
{ currentTrack: id },
);
this.player.elapsed = Object.assign(
{},
this.player.elapsed,
{ elapsed: 0 },
);
// this.play();
},


It seems no error, until I click the button

Error

Error: Cannot read property 'duration' of undefined


In Main.vue,
currentTrack.duration


<div class="player__timer">
<div class="player__timer__elapsed" v-text="player.elapsed"></div>

<div class="player__timer__total" v-text="currentTrack.duration"></div>
</div>

<div class="slider player__progress-bar">
<input type="range" :value="player.elapsed" :max="currentTrack.duration" />
</div>

Answer Source

You used currentTrack.duration instead of player.currentTrack.duration, try this:

<div class="player__timer">
  <div class="player__timer__elapsed" v-text="player.elapsed"></div>

  <div class="player__timer__total" v-text="player.currentTrack.duration"></div>
</div>

<div class="slider player__progress-bar">  
  <input type="range" :value="player.elapsed" :max="player.currentTrack.duration" />
</div>
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download