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）测试下拉刷新功能

（2）分享功能测试

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

作者：猫宁一
全栈程序媛₍ᐢ •⌄• ᐢ₎一枚~ 热爱学习！热爱编程！
可关注【猫宁一】公众号领取我所有全栈项目代码哦~

点击查看课程目录：微信小程序全栈开发课程目录