5.3【微信小程序全栈开发课程】首页完善(三)--下拉刷新、分享功能

简介: 如果服务器出现错误,用户可以自己下拉刷新页面来获取当前分数下拉刷新的函数是onPullDownRefresh这节我们来实现下拉刷新的功能

1、创建文件


在src/pages/index文件夹下面创建main.json文件,并在文件里面加上代码,用来允许这个页面可以下拉刷新


{
  "enablePullDownRefresh":true
}


2、添加下拉刷新函数


编辑src/pages/index/index.vue文件,添加onPullDownRefresh函数


//参考代码,无需粘贴
//onShow () {
//...
//},
//需要添加的部分,不要忘记在上一行添加逗号
onPullDownRefresh () {
  this.getCurrentMark()
  //获取完当前分数后,停止下拉刷新的状态
  wx.stopPullDownRefresh()
}


3、添加分享函数


还是继续在index.vue文件中添加,分享函数是onShareAppMessage


//参考代码,无需粘贴
//onPullDownRefresh () {
//...
//},
//需要添加的部分,不要忘记在上一行添加逗号
onShareAppMessage(e) {
  return {
    title: "真自律",
    path: "/pages/index/main",
    imageUrl: ""
  }
}


4、测试


(1)测试下拉刷新功能


image.png


(2)分享功能测试


点击右上角的「三点」按钮,出现转发的选项,说明添加成功


image.png


目录
打赏
0
0
0
0
3311
分享
相关文章
小程序全栈开发中的WebSocket实时通信实践
【10月更文挑战第3天】随着移动互联网的发展,小程序因便捷的用户体验和社交传播能力,成为企业拓展业务的新渠道。本文探讨了小程序全栈开发中的WebSocket实时通信实践,包括其实时通信、长连接及双向通信的特点,并通过实时聊天、推送、游戏和监控等功能的实现,展示了WebSocket在小程序中的应用。开发者需注意安全性、性能及兼容性等问题,以保障小程序的稳定运行和用户体验。
88 7
微信小程序全栈开发中的身份认证与授权机制
【10月更文挑战第3天】随着移动互联网的发展,微信小程序凭借便捷的用户体验和强大的社交传播能力,成为企业拓展业务的新渠道。本文探讨了小程序全栈开发中的身份认证与授权机制,包括手机号码验证、微信登录、第三方登录及角色权限控制等方法,并强调了安全性、用户体验和合规性的重要性,帮助开发者更好地理解和应用这一关键技术。
146 5
微信小程序全栈开发中的PWA技术应用
【10月更文挑战第3天】微信小程序作为新兴应用形态,凭借便捷体验与社交传播能力,成为企业拓展业务的新渠道。本文探讨了微信小程序全栈开发中的PWA技术应用,包括离线访问、后台运行、桌面图标及原生体验等方面,助力开发者提升小程序性能与用户体验。PWA技术在不同平台的兼容性、性能优化及用户体验是实践中需注意的关键点。
101 5
uni-app开发实战:利用Vue混入(mixin)实现微信小程序全局分享功能,一键发送给朋友、分享到朋友圈、复制链接
uni-app开发实战:利用Vue混入(mixin)实现微信小程序全局分享功能,一键发送给朋友、分享到朋友圈、复制链接
773 0
小程序全栈开发中的CI/CD流程与自动化部署是一种高效的开发模式。
本文探讨小程序全栈开发中的CI/CD流程与自动化部署,介绍持续集成与部署的概念,包括自动化构建、测试、代码审查及部署实践。通过提高代码质量、迭代速度及团队协作效率,确保小程序稳定运行与良好用户体验。
119 2
微信小程序全栈开发中的异常处理与日志记录是一个重要而复杂的问题。
微信小程序作为业务拓展的新渠道,其全栈开发涉及前端与后端的紧密配合。本文聚焦小程序开发中的异常处理与日志记录,从前端的网络、页面跳转等异常,到后端的数据库、API调用等问题,详述了如何利用try-catch及日志框架进行有效管理。同时强调了集中式日志管理的重要性,并提醒开发者注意安全性、性能及团队协作等方面,以构建稳定可靠的小程序应用。
104 1
AstrBot:轻松将大模型接入QQ、微信等消息平台,打造多功能AI聊天机器人的开发框架,附详细教程
AstrBot 是一个开源的多平台聊天机器人及开发框架,支持多种大语言模型和消息平台,具备多轮对话、语音转文字等功能。
2598 15
AstrBot:轻松将大模型接入QQ、微信等消息平台,打造多功能AI聊天机器人的开发框架,附详细教程
uni-app开发微信小程序的报错[渲染层错误]排查及解决
uni-app开发微信小程序的报错[渲染层错误]排查及解决
994 7
uni-app开发微信小程序:四大解决方案,轻松应对主包与vendor.js过大打包难题
uni-app开发微信小程序:四大解决方案,轻松应对主包与vendor.js过大打包难题
942 1

热门文章

最新文章