点击空白处退出提示
作品详情
技术栈:uniapp 、即时通讯 IM、uniapp-ui、
技术要点:
1、使用百度云人脸识别验证用户实名认证的准确性
2、使用即时通讯 IM 进行在线聊天、添加好友等操作
3、封装功能函数,实现文件异步压缩上传、权限的控制页面数据展示的不同
4、封装顶部导航栏、图文展示等组件,在多个页面实现复用,减少代码体积
5、获取用户当前经纬度,使用高德地图接口获取用户详细位置
6、使用 better-scroll 优化页面滚动,使用 fastclick 插件解决 click 事件300ms 延迟;
技术难点:
1、聊天消息发出滚动条不会自动定位到底部,用户体验感差
2、首页首次请求服务器数据过多渲染到页面出现
1、2秒白屏情况,用户没有下拉加载的体验感
3、不同用户的手机查看用户界面出现页面不自适应出现部分空白区域
4、短时间跳转相同页面接口未及时更新
解决方式:
1、使用 scroll-view 组件添加一个 scroll-into-view 属性给每一个 scroll-view 的子元素添加 id 属性
2、把数据存入一个空白数组里,第一次使用 splice()取十条数据添加到另一个数组里,使用 onReachBottom 生命周期用户触底时使用 setTimeout 延迟一秒,再次使用 splice()取十条数据,同时解决了页面出现白屏情况和下拉加载的体验感
3、使用 uni.getSystemInfo()获取不同手机高度,动态修改元素高度
4、使用 setTimeout 延迟500ms 调用接口
声明:本文仅代表作者观点,不代表本站立场。如果侵犯到您的合法权益,请联系我们删除侵权资源!如果遇到资源链接失效,请您通过评论或工单的方式通知管理员。未经允许,不得转载,本站所有资源文章禁止商业使用运营!
下载安装【程序员客栈】APP
实时对接需求、及时收发消息、丰富的开放项目需求、随时随地查看项目状态
评论