-
第1章 課程內容介紹
包括課程概述、課程安排、學習前提、講授方式等方面的介紹，最後演示了整個音樂App的功能，讓同學們對課程項目有一個直觀的瞭解。
- 1-1 導學試看
- 1-2 課前必讀（源碼獲取方式）試看
-
第2章 項目準備工作
包括項目需求分析、腳手架初始化代碼、項目目錄介紹及圖標字體、公共樣式等資源的準備 。
- 2-1 需求分析試看
- 2-2 Vue-cli腳手架安裝
- 2-3 項目目錄介紹及圖標字體、公共樣式等資源準備
-
第3章 頁面骨架開發
包括頁面入口、header 組件的編寫、路由配置及頂導 tab 組件開發。
- 3-1 頁面入口+header 組件的編寫
- 3-2 路由配置+ tab 頂導組件開發
-
第4章 推薦頁面開發
包括 jsonp 原理介紹和 Promise 封裝、輪播圖組件開發、歌單接口數據分析和抓取、axios 介紹和後端接口代理、歌單列表組件開發和數據應用、scroll 組件的抽象和應用、vue-lazyloader 懶加載插件的介紹和應用、loading 基礎組件開發和應用。...
- 4-1 頁面簡介+輪播圖數據分析
- 4-2 jsonp原理介紹+Promise封裝
- 4-3 jsonp的應用+輪播圖數據抓取
- 4-4 輪播圖組件實現（上)
- 4-5 輪播圖組件實現（中)
- 4-6 輪播圖組件實現（下）
- 4-7 歌單數據接口分析
- 4-8 axios 介紹和後端接口代理
- 4-9 歌單列表組件開發和數據的應用
- 4-10 scroll 組件的抽象和應用（上）
- 4-11 scroll 組件的抽象和應用（下）
- 4-12 vue-lazyload 懶加載插件介紹和應用
- 4-13 loading 基礎組件的開發和應用
-
第5章 歌手頁面開發
包括歌手數據的抓取和處理、Singer 類的封裝、類通訊錄組件 listview開發和應用。
- 5-1 歌手頁面佈局和設計講解
- 5-2 歌手數據接口抓取
- 5-3 歌手數據處理和 Singer 類的封裝
- 5-4 listview 基礎組件的開發和應用-滾動列表實現
- 5-5 listview 基礎組件的開發和應用-右側快速入口實現（1）
- 5-6 listview 基礎組件的開發和應用-右側快速入口實現（2）
- 5-7 listview 基礎組件的開發和應用-右側快速入口實現（3）
- 5-8 listview 基礎組件的開發和應用-右側快速入口實現（4）
- 5-9 listview 基礎組件的開發和應用-滾動固定標題實現（上）
- 5-10 listview 基礎組件的開發和應用-滾動固定標題實現（下）
-
第6章 歌手詳情頁開發
包括子路由的配置及轉場動畫實現、Vuex 的介紹、Vuex 初始化歌手數據的配置、歌手詳情頁數據抓取和處理、Song 類的封裝、music-list 組件開發。
- 6-1 歌手詳情頁佈局和設計詳解
- 6-2 子路由配置以及轉場動畫實現
- 6-3 初識 Vuex
- 6-4 Vuex 初始化及歌手數據的配置
- 6-5 歌手詳情數據抓取
- 6-6 歌手詳情數據處理和Song類的封裝（上）
- 6-7 歌手詳情數據處理和Song類的封裝（下）
- 6-8 music-list 組件開發（1）
- 6-9 music-list 組件開發（2）
- 6-10 music-list 組件開發（3）
- 6-11 music-list 組件開發（4）
- 6-12 music-list 組件開發（5）
- 6-13 music-list 組件開發（6）
- 6-14 music-list 組件開發（7）
-
第7章 播放器內置組件開發
包括播放器 Vuex 數據設計和相關應用、播放器基礎樣式及歌曲數據應用、 播放器展開收起動畫的實現、播放器前進後退功能實現、播放器播放時間獲取和更新、progress-bar 進度條組件開發、progress-circle 圓形進度條組件開發、播放器模式切換功能實現、播放器歌詞數據抓取和解析、播放器歌詞左右滑動的實現、播放器底部播...
- 7-1 播放器頁面設計詳解
- 7-2 播放器Vuex數據設計
- 7-3 播放器Vuex的相關應用
- 7-4 播放器基礎樣式及歌曲數據的應用
- 7-5 播放器展開收起動畫（上）
- 7-6 播放器展開收起動畫（中）
- 7-7 播放器展開收起動畫（下）
- 7-8 播放器歌曲播放功能實現
- 7-9 播放器歌曲前進後退功能實現（上）
- 7-10 播放器歌曲前進後退功能實現（下）
- 7-11 播放器播放時間獲取和更新
- 7-12 播放器progress-bar進度條組件實現（上）
- 7-13 播放器progress-bar進度條組件實現（中）
- 7-14 播放器progress-bar進度條組件實現（下）
- 7-15 播放器progress-circle 圓形進度條組件實現
- 7-16 播放器模式切換功能實現（上）
- 7-17 播放器模式切換功能實現（中）
- 7-18 播放器模式切換功能實現（下）
- 7-19 播放器歌詞數據抓取
- 7-20 播放器歌詞數據解析
- 7-21 播放器歌詞滾動列表實現
- 7-22 播放器歌詞左右滑動實現（上）
- 7-23 播放器歌詞左右滑動實現（下）
- 7-24 播放器歌詞剩餘功能實現
- 7-25 播放器底部播放器適配+mixin的應用
-
第8章 歌單頁面開發
包括歌單頁面的佈局介紹、Vuex 實現路由數據通訊、歌單詳情頁數據抓取和處理。
- 8-1 歌單詳情頁佈局介紹及Vuex實現路由數據通訊
- 8-2 歌單詳情頁數據抓取
- 8-3 歌單詳情頁數據的處理和應用
-
第9章 排行榜及詳情頁開發
包括排行榜佈局介紹、排行榜數據抓取和應用、榜單詳情頁佈局介紹、Vuex 實現路由數據通訊、榜單詳情頁數據抓取和應用。
- 9-1 排行頁面佈局介紹及排行榜數據抓取
- 9-2 排行頁排行榜數據應用
- 9-3 榜單詳情頁佈局介紹及Vuex實現路由數據通訊
- 9-4 榜單詳情頁數據抓取和應用
- 9-5 帶排行的song-list組件擴展和應用
-
第10章 搜索頁面開發
包括search-box 組件開發、熱門搜索數據抓取和應用、suggest 組件開發、搜索結果保存功能實現、search-list 組件開發、confirm 組件開發。
- 10-1 搜索頁面頁面佈局和功能介紹
- 10-2 搜索頁面search-box組件開發
- 10-3 搜索頁面熱門搜索數據抓取和應用
- 10-4 搜索頁面suggest組件開發（1）
- 10-5 搜索頁面suggest組件開發（2）
- 10-6 搜索頁面suggest組件開發（3）
- 10-7 搜索頁面suggest組件開發（4）
- 10-8 搜索頁面suggest組件開發（5）
- 10-9 搜索頁面suggest組件開發（6）
- 10-10 搜索頁面suggest組件開發（7）
- 10-11 搜索頁面搜索結果保存功能實現（1）
- 10-12 搜索頁面搜索結果保存功能實現（2）
- 10-13 搜索頁面搜索結果保存功能實現（3）
- 10-14 搜索頁面search-list 組件功能實現（上）
- 10-15 搜索頁面search-list 組件功能實現（下）
- 10-16 搜索頁面confirm 組件功能實現
- 10-17 搜索頁面剩餘功能實現（上）
- 10-18 搜索頁面剩餘功能實現（下）
-
第11章 歌曲列表組件
包括歌曲列表組件的顯示和隱藏控制、播放列表的實現、player mixin 的抽象、 add-song 組件開發、top-list 組件開發、scroll 組件能力的擴展
- 11-1 歌曲列表組件佈局和功能介紹
- 11-2 歌曲列表組件顯示和隱藏的控制
- 11-3 歌曲列表組件播放列表的實現（1）
- 11-4 歌曲列表組件播放列表的實現（2）
- 11-5 歌曲列表組件播放列表的實現（3）
- 11-6 歌曲列表組件播放列表的實現（4）
- 11-7 歌曲列表組件播放列表的實現（5）
- 11-8 歌曲列表組件 playerMixin的抽象（上）
- 11-9 歌曲列表組件 playerMixin的抽象（下）
- 11-10 歌曲列表組件add-song組件實現（1）
- 11-11 歌曲列表組件add-song組件實現（2）
- 11-12 歌曲列表組件add-song組件實現（3）
- 11-13 歌曲列表組件add-song組件實現（4）
- 11-14 歌曲列表組件add-song組件實現（5）
- 11-15 歌曲列表組件add-song組件實現（6）
- 11-16 歌曲列表組件top-list組件實現
- 11-17 歌曲列表組件scroll組件能力的擴展
-
第12章 用戶中心頁面
包括收藏列表的 Vuex 數據設計與實現、收藏歌曲功能實現、頁面功能開發。
- 12-1 用戶中心頁面佈局和功能介紹
- 12-2 用戶中心頁面收藏列表的Vuex數據設計和實現
- 12-3 用戶中心頁面收藏歌曲功能實現（上）
- 12-4 用戶中心頁面收藏歌曲功能實現（下）
- 12-5 用戶中心頁面剩餘功能實現（上）
- 12-6 用戶中心頁面剩餘功能實現（下）
-
第13章 編譯打包
包括播放內核小 bug 修復、項目編譯打包及 node 服務調試、路由組件實現懶加載、Vue.js 升級到最新版。
- 13-1 編譯打包-播放內核小bug修復
- 13-2 編譯打包-項目編譯打包及node服務測試
- 13-3 編譯打包-路由組件實現懶加載
- 13-4 編譯打包-Vue.js升級到最新版
-
第14章 課程總結
包括移動端常用工具 charles 和 vconsole 的介紹、課程回顧。
- 14-1 移動端調試工具和抓包工具介紹（上）
- 14-2 移動端調試工具和抓包工具介紹（下）
- 14-3 課程總結
-
第15章 課程有關資料彙總
課程有關資料彙總
- 15-1 課程資料彙總
對於想要進階Vue高級方面的同學有很大的幫助，話不多說，call我 v x : lemon956688