微商城(小程序)
项目描述:
丰富的商品信息,高质量低折扣,涵盖各生活所需要的商品领域,向广大用户提供了低价高质量的购买体验。
微商城,为全民生活寻找最优价值。
技术描述:
1. 全局 app 的配置;
2. .使用 Vscode 编写代码,微信开发工具进行调试查看渲染后的效果,使用 ESlint 规范代码;
3. 底部 tabbar 添加,pages 多页面添加,页面跳转(wx.navigateTo) 、template 来定义模板 实现复用;
3. 使用 uni.login 与 wx.authorize 实现微信授权登入;
5. 使用 promise 进行对 uni.request 进行封装, 操作小程序交互页面数据的渲染和逻辑判断;
6. 使用开源的 uniapp 框架进行开发,页面采用 flex 结合 rpx 布局实现适配移动端不同设备,并调用后台数据进行
数据交互;
7. 使用框架生命周期进行数据正确赋值;
项目职责:
1. 严格根据设计图纸完成首页,商品详情页,购物车等页面的搭建
2. 使用 promise 进行对 uni.request 进行封装, 操作小程序交互页面数据的渲染和逻辑判断;
3. 通过 swiper 标签实现轮播图效果,通过 tabBar 底部选项卡实现页面跳转,使用 uni.showToast 方法实现消
息提示框,优化用户体验。
4. 对搜索输入框,搜索页面的封装成公用的组件以便于其他页面的使用,优化代码结构,提高代码的可读性;
5. 完成购物车中商品选中后,利用计算属性(computed)来实现总价格的计算,使用 watch 来侦听商品是否选
择从而实现全选功能
内部员工管理系统
项目描述:
该项目可用于员工的评分,请假的录入,员工动态的发表,公告的发表,用户信息且权限更改等功能
技术描述:
1. 前端采用 Vue 急速技术,UI 库使用 Element UI
2. 采用 Vue 组件化开发,提高开发效率,复用性高,项目可维护性高
3. 使用 vuex 管理数据,vue-router 路由跳转
4. 使用 axios 发送请求,调用后台数据,保证网站数据实时更新
项目职责:
1. 登入页面:用于用户登入,以及权限校验功能,使用 vue-router 路由守卫判断用户的操作权限
2. 内部公告页面:用于查看公司内部通告信息,可点击查看更多,进入公告列表页面,且有分页功能
3. 查看更多组件的抽取,使用组件时传递路由地址,从而动态的跳转对应的页面
项目的难点:
在用户登入后,进行页面的切换时如何以用户对应的权限来进行判断,是否可以访问该页面,以及对应的不同
的权限,来显示不同的页面布局
解决方法:
1. 在对应路由配置添加可访问权限数组,在前置守卫进行判断该用户是否可访问,在进行处理
2. 页面根据权限的不同,来判断是否显示对应的操作按钮与页面