概述
- vue进阶练习
- 基于vue-cli 3.0脚手架构建的
- 仿猫眼webapp
- github地址：https://github.com/santana2000/hah-movie
界面展示
项目结构
- 页面结构主要分为页面级组件和通用组件，页面级的主要用于底部栏切换不同页面，通用组件有顶部栏、底部栏和滑动组件等
- 路由新建了一个文件夹，每个页面的路由分开写，以模块形式导出，汇总在一个文件中引用，以免页面过多时路由文件混乱
- 通用的css文件放在public文件夹中和index.html同级
- 字体图标放在assets文件夹中
- App.vue中只写顶级路由插座，渲染内容
功能汇总
- Flex布局，使用阿里字体图标库
- 城市列表：本地存储
- 城市切换：状态管理
- 城市索引：offsetTop + scrollTop
- 接口数据获取：axios
- 数据格式预处理：过滤器
- 二级菜单：子路由
- 详情页：命名视图 + 动态路由
- 搜索页面：函数防抖
- 滑动效果：better-scroll插件
- 反向代理：新增vue.config.js解决跨域