移动端项目分析
2023-06-11 20:12:14 10 举报AI智能生成
嗨购
作者其他创作
大纲/内容
项目搭建
scr里创建stroe router utils 文件
安装路由，vant ,vuex，axios 包
router下配置，进行全局注册，配置路由规则，导出，并在main.js中注册
配置axios，和拦截器
配置基准路径，一个开发，一个上线
登陆页面
使用ui组件库写好静态结构 在views/login/index.vue
做好相应的表单验证 账号/密码的正则
封装axios，在src/utils/requerst.js中
获取接口 src/api/user.js
配置路由，在views/router/index
安装vuex包，创建views/store/modules/index ，定义user模块 ，配置好需要的内柔
配置数据持久化
loyout
在mian.js中导入vant组件 Tabbar, TabbarItem
在router/index.js中配置嵌套规则
在loyout/index.vue 中写路由出口 一定要写
home页面
使用ui组件库，导入 search，swipe，grid,list的组件，在mian.js全局注册，
创建src/api/home.js ,配置好需要的接口
在home页面中使用钩子发送请求
设置上拉加载，下拉刷新，图片加载失败显示的图
category页面
分为三级分类，两边使用flex布局
编写api接口，注册组件
左边一级分类，使用组件，调用接口
再渲染右边二三级分类
GoodsDetail页面
从首页的list点击跳转到GoodsDetail
页面布局使用组件库vant 有 swipt bar gooda-ation tag
navbar的标题需要调用api
创建api/goods.js进行封装api接口
购物车徽标使用getters先获取数据然后进行判断 最后再页面中调用
Cart页面
首先创建仓库，carts 然后再src/store/index.js注册模块
加入购物车遍历数组
仓库中拿到的数据，进行页面渲染
购物车底部的全选，统计，反选，加减商品
My页面
进行页面的渲染
头像和个人姓名 携带token
设置权限
页面优化
混入
路由懒加载
注册全局的Vant放到 文件夹plugins里
0 条评论
下一页
为你推荐
查看更多
