运行项目
- npm install
- npm run dev
项目展示
项目涉及到技术栈：
- vue：Vue、Vue-router、Vuex、Vue-cli
- 插件：vue-awesome-swiper、better-scroll Axios
- CSS的预处理框架 stylus
- api 后台数据接口
主要特点
- 组件化自适应布局
- 代码，简洁，易维护
- 兼容大部分浏览器
- 性能优化
项目结构部分
Header部分
- 引入 Iconfont
- 首页轮播
- 图标区域轮播
- 使用axios获取接口数据
- 组件间数据传递
城市选择页面开发
- Better-scroll的使用和字母表布局
- eventbus 传值
- 列表性能优化
- 搜索逻辑实现
- Vuex实现数据共享
- LocalStorage实现页面数据持久存储
- 使用keep-alive优化路由页面性能
详情页面开发
- 动态路由配置及banner布局
- 公用画廊组件拆分
- 渐隐渐显的header效果实现
- 递归组件实现详情列表
- 画廊动画效果封装
