将这段js代码var music = documentquerySelectormusic-element var playBtn = documentquerySelectorplay var seekbar = documentquerySelectorseekbar var currentTime = documentquerySelectorcurrent-time

data() { return { music: null, playBtn: null, seekbar: null, currentTime: null, duration: null, favIcon: null } }, mounted() { this.music = document.querySelector('.music-element') this.playBtn = document.querySelector('.play') this.seekbar = document.querySelector('.seekbar') this.currentTime = document.querySelector('.current-time') this.duration = document.querySelector('.duration') this.favIcon = document.querySelector('.favorite')

this.music.onloadeddata = () => { this.seekbar.max = this.music.duration const ds = parseInt(this.music.duration % 60) const dm = parseInt((this.music.duration / 60) % 60) this.duration.innerHTML = ${dm}:${ds} }

this.music.ontimeupdate = () => { this.seekbar.value = this.music.currentTime }

this.music.addEventListener('timeupdate', () => { const cs = parseInt(this.music.currentTime % 60) const cm = parseInt((this.music.currentTime / 60) % 60) this.currentTime.innerHTML = ${cm}:${cs} }, false) }, methods: { handlePlay() { if (this.music.paused) { this.music.play() this.playBtn.className = 'pause' this.playBtn.innerHTML = 'pause' } else { this.music.pause() this.playBtn.className = 'play' this.playBtn.innerHTML = 'play_arrow' } this.music.addEventListener('ended', () => { this.playBtn.className = 'play' this.playBtn.innerHTML = 'play_arrow' this.music.currentTime = 0 }) }, handleSeekBar() { this.music.currentTime = this.seekbar.value }, handleFavorite() { this.favIcon.classList.toggle('active') }