Vue.js全家桶高還原網易雲音樂(Windows PC版)

項目地址

  • 因爲網易雲的api限制,部分功能可能會失效,若有須要能夠clone項目下來在本地運行,若是api炸了,麻煩在評論中告知一下我前端

  • 由於作的是PC端 因此請在電腦端訪問git

  • 源碼地址github

  • 項目預覽(評論和歌單詳情api都封了個人ip暫時沒法使用這兩個功能了)express

項目描述

前端部分後端

  • 實現了滑塊、彈出層、歌詞、分頁、輪播等組件 全部組件皆獨立完成api

  • 使用了Vue.js作單頁應用跨域

  • 使用了Vue Router處理路由spa

  • 使用了Vuex管理組件間的狀態,實現非父子組件之間的通訊localstorage

  • 初始化數據經過localstorage存儲blog

後端部分

  • 開發環境下使用了express處理路由

  • 經過CORS解決跨域問題

完成狀況

實現了

(登陸功能一開始想作的,但一想你們也不放心把網易雲帳號密碼用來登陸,因此仍是沒作了)

  • 網易雲音樂首頁(輪播、推薦歌單、每日推薦、熱門歌單、排行榜、熱門歌手、最新音樂)

  • 切換主題(由於PC端切換主題要改的樣式太繁瑣,因此只作了黑色和紅色的主題)

  • 搜索(歌曲搜索、歌手搜索、歌單搜索、專輯搜索)

  • 播放頁面(歌詞顯示、全部評論顯示(分頁展現))

  • 歌單、專輯、歌手信息等展現頁

  • 固然還有最重要的播放功能(音量調節、快進快退、切歌、當前歌單)

首頁(紅色主題)

首頁(黑色主題)

播放頁

歌單內容

圖就放一部分了,更多內容歡迎戳 http://oyhfe.com/VueMusic

最後!重點!敲黑板!

距離上次交做業已通過了二十多天了,一開始也沒想到這個項目會花掉我這麼久時間,一路踩了不少坑,內容實現也有些繁瑣,可是收穫仍是不少的,增長了Vue全家桶熟練度。

歡迎你們提issue,pr

相關文章
相關標籤/搜索