蚕食生活(H5+app)

我要开发同款
绝世红尘2024年05月06日
54阅读
开发技术webpack、node.js、axios、vuejavascript

作品详情

1)在项目的大致需求和主体功能完成研究后,由我们的技术主管搭建整个项目框架,同时介绍项目流程,构建不同模块目录,分配给前端小组的指定人员。
2)在项目中导入vux的组件,使用localstorage来存储用户的当前登录信息和其他的一些存储数据。
3)项目中使用vuex来管理各个组件的状态,同时使用require.context来导入store和route的模块,实现store的模块化和route的模块化。
4)将 第三方插件wn-vue-mescroll封装成一个全局的上拉加载和下拉刷新的组件vue-mescroll。
5)在订单模块引入组件vue-mescroll实现页面的下拉刷新和上拉加载,使用store来管理订单的不同状态,缓存订单数据,减少接口的调用次数。将订单的状态名称和id以getters返回,单个状态以传参(订单状态的status)的形式同样在getters中实现。
6)与订单模块的实现原理一致,优惠券模块中同样使用vue-mescroll和store实现相关功能。
7)在商品详情页新增分享链接和海报分享,海报分享以canvas实现,分享携带当前登录用户的id,在app.vue中获取分享人的id,存入sessionstorage中,在购买商品时若存在分享id则将其传送到后台,不存在则不传。
8)首页的轮播图使用vux的swiper组件,同时由于后台传入的图片高度不固定,所以在初始化swiper高度为0,在获取到图片的信息之后再动态设置swiper的高度。
9)项目中的提示类信息和消息确认框使用vux的toastPlugin和confirmPlugin。
APP.vue中引入封装的全局组件tabbar,将tabbar的显示状态保存在全局store的state中,同时在meta中定义showtabbar来显示与隐藏tabbar,在router.beforeEach中去根据to.meta.showtabbar来更改tabbar的显示状态。
声明:本文仅代表作者观点,不代表本站立场。如果侵犯到您的合法权益,请联系我们删除侵权资源!如果遇到资源链接失效,请您通过评论或工单的方式通知管理员。未经允许,不得转载,本站所有资源文章禁止商业使用运营!
下载安装【程序员客栈】APP
实时对接需求、及时收发消息、丰富的开放项目需求、随时随地查看项目状态

评论