前言
此demo后端用的是別人提供的線上接口地址旦万，api參考地址：鏈接。源碼地址：github抽莱，感興趣的同學可以看看范抓。受gif圖大小影響骄恶，以下動態(tài)圖如加載過慢請耐心等待食铐。
技術棧
前端
vue 前端頁面展示
vue-router spa
axios 異步請求
localStorage 書架信息的存儲
vant (輕量、可靠的移動端 Vue 組件庫僧鲁，更適用于移動端)與 element-ui (更適用于pc端)部分引入
vuex 狀態(tài)管理
stylus css預處理器
vue 插槽slot
iconfont 阿里巴巴矢量圖標庫
Echarts 數(shù)據(jù)可視化
引入高德地圖核心JS API (高德地圖使用入門教程)
實現(xiàn)功能
- 頭部組件復用
- 適配移動pc端
- 搜索功能
- 小說分類
- 小說詳情展示
- 小說章節(jié)選擇
- 小說加入書架
- 手動記錄閱讀歷史
- 書架刪除模塊
- 主題背景色切換
- 新聞模塊
- 獲取城市天氣信息
項目預覽
效果總覽
效果圖.gif
搜索功能
效果圖.gif
小說分類
效果圖.gif
小說章節(jié)選擇和加入書架
效果圖.gif
書簽刪除
效果圖.gif
背景色切換
效果圖.gif
新聞天氣模塊
效果圖.gif
適配移動pc端
適配.gif
結語
功能模塊具體實現(xiàn)后續(xù)完善~~如果你對此感興趣的話可自行查看源碼虐呻。如果有什么錯誤或者不足之處，歡迎大家斧正寞秃，十分感謝斟叼！學習的路還很長，紙上得來終覺淺春寿，務必多實踐朗涩。
