前言
此demo后端用的是别人提供的线上接口地址，api参考地址：链接。源码地址：github，感兴趣的同学可以看看。受gif图大小影响，以下动态图如加载过慢请耐心等待。
技术栈
前端
vue 前端页面展示
vue-router spa
axios 异步请求
localStorage 书架信息的存储
vant (轻量、可靠的移动端 Vue 组件库，更适用于移动端)与 element-ui (更适用于pc端)部分引入
vuex 状态管理
stylus css预处理器
vue 插槽slot
iconfont 阿里巴巴矢量图标库
Echarts 数据可视化
引入高德地图核心JS API (高德地图使用入门教程)
实现功能
- 头部组件复用
- 适配移动pc端
- 搜索功能
- 小说分类
- 小说详情展示
- 小说章节选择
- 小说加入书架
- 手动记录阅读历史
- 书架删除模块
- 主题背景色切换
- 新闻模块
- 获取城市天气信息
项目预览
效果总览
效果图.gif
搜索功能
效果图.gif
小说分类
效果图.gif
小说章节选择和加入书架
效果图.gif
书签删除
效果图.gif
背景色切换
效果图.gif
新闻天气模块
效果图.gif
适配移动pc端
适配.gif
结语
功能模块具体实现后续完善~~如果你对此感兴趣的话可自行查看源码。如果有什么错误或者不足之处，欢迎大家斧正，十分感谢！学习的路还很长，纸上得来终觉浅，务必多实践。
