用Vue來實現音樂播放器（三十八）：歌詞滾動列表的問題
阿新 • • 發佈：2018-06-23
vue 三十八 pla -s toggle 情況 TP 解決辦法 暫停 
1、頻繁切換歌曲時，歌詞會跳來跳去
原因：
// 歌詞跳躍是因為內部有一個currentLyric對像內部有一些功能來完成歌詞的跳躍 //每個currentLyric能實現歌曲的播放跳到相應的位置 是因為它內部有個計時器 //每次currentSong改變的時候都會重新new一個新的lyric-parser出來， //但是我們之前的對象並沒有做清理操作 也就是說我們之前對象還是有計時器在裏面 //所以歌詞會來回閃動 解決辦法： 在切換歌曲之前 即getLyric()之前 重新去getLyric()之前 //我們要把當前的currentLyric給stop掉
2、還有一個bug 當我們點擊暫停按鈕的時候 歌詞仍然會跳動 此時我們需要在togglePlaying()中解決
3、當播放狀態為循環播放的時候 當播放時間為剛開始的時候 歌詞並沒有回到最初的位置 在loop函數中實現
4、當調整播放進度的時候 歌詞進度並沒有改變 解決辦法：在onProgressBarChange()中添加一下邏輯
5、在cd下方顯示當前歌詞
6、考慮異常情況
7、當歌曲列表只有一首歌的時候 執行next函數的時候
解決辦法：當列表只有一首歌曲的時候 直接讓它循環播放即可
同樣prev()也是一樣的邏輯 在只有一首歌曲的前提下讓它單曲循環
8、當我們在微信裏面播放的時候 如果微信到後臺了 實際上js是不會執行的 js不執行但audio是可以將當前歌曲播放完的 一旦當前歌曲播放完畢會去觸發end事件 但是end不會被執行因為是js 如果end不執行 那麽我們再次播放的時候songReady就一直不會設置為true 如果songReady不置為true 那麽我們就切換不了
9、此時下面的迷你播放器是占高度的 所以我們以前的滾動距離的計算就會出現問題
用Vue來實現音樂播放器（三十八）：歌詞滾動列表的問題