1:你学会了什么
学会了组件的调用、通用模块的编写以及一个较为完整项目是如何一步步完成实现的。
学会了如何请求数据并联动到页面功能上。学会了本地存储实现页面传值
2:你的进步有哪些
进步:更加熟练地掌握了一些js技术,通过实地使用各种api,让我明确了许多api的具体应用。在实现各项功能的过程中我对触发事件有了更深的影响。对代码的编写逻辑认知有了进一步的提升。寻找bug并解决的能力有了进步。
3:你哪里不会
通用模块与组件的编写只明白了一个大概,并没有深入掌握。楼层滚动在页面高度过小时仍存在bug
4:总结项目中有那些业务,你是如合实现的
登陆注册:通过获取用户在input框中输入的value值,先用正则判断用户是否输入的符合条件,当符合条件后便进行请求,获取返回的data值来判断是否注册/登陆成功,并用本地存储的方法将登陆成功获取的token存储
分类页:先通过接口获取分类内容并渲染一条导航栏,然后通过点击跳转并在跳转过去的页面的url上拼上分类标签。在跳转的分类页截取url,并将分类标签切割获取。最后根据获取的分类标签判断数据并渲染页面
详情页:根据数据获取商品id实现跳转。在详情页中使用tap切换实现图片切换。使用隐藏等比例放大图片使其局部显示的方式实现放大镜。最后构造一个添加购物车按钮并根据登录获取的token以及商品id请求接口实现添加购物车。
购物车:根据本地存储的token获取账号购物车数据并渲染页面,遍历删除、添加、减少按钮并依次对应绑定点击事件,进行接口请求,当添加或减少事件成功时再次请求获取商品信息中的conts计数用以实时更新商品数量,最后为减少点击事件增加一个判定,使商品数量不得为负数。
搜索页:没啥技术,基本接口已经全部实现了,只要能获取input的value值就已经成功了
5:总结你写的项目中有那些技术亮点并详细说明
懒加载、触底分页、一键返回顶部。
这三项的都是基于监听页面滚动实现的,懒加载是通过判断图片的高度变化来决定是否显示图片正确内容。触底分页是监听到当页面滚动触底是请求数据中的page参数++实现分页增加。一键返回顶部是给一个元素绑定点击事件,是其点击时令页面高度变为0。