先介绍一下我的项目逻辑：

1：在首页有个按钮button，open-type为getuserinfo，用bindgetuserinfo获取到信息，然后我将用户的昵称跟头像用setStorage存起来，在第三个页面取到用户的昵称跟头像。然后在第三个页面需要生成一张图片(点击按钮canvas绘制)。

现在在开发者工具里面一切看起来并没有什么问题，在第一个页面console.log()时第一次点击button，也可以打印出来用户的头像url地址，所以在第三个页面也就没有什么问题了.

但是在真机上，第一次点击第一个页面的按钮时，头像的url打印不出来，获取不到。每次重新进入小程序都要重新返回到第一个页面才能获取到头像url（点击两次按钮）。

下面贴上我的代码：

<button class="start-btn" style='margin-top: -140rpx;' open-type='getUserInfo' bindgetuserinfo='getUserInfo' type="primary" bindtap='canILogin'>开 始</button>

getUserInfo(){
    var that = this;
    wx.downloadFile({
        url: this.data.avatarUrl,
        success: function (res) {
          console.log(res.tempFilePath);
          that.setData({
            avatarUrl: res.tempFilePath
          })
        }
      })
}，
onHide: function () {
    var that = this;
    wx.downloadFile({
      url: this.data.avatarUrl,
      success: function (res) {
        console.log(res.tempFilePath);
        that.setData({
          avatarUrl: res.tempFilePath
        })
      }
    })
    console.log(this.data.avatarUrl);
    wx.setStorage({
      key: 'userInfo',
      data: [this.data.avatarUrl, this.data.nickName],
    })
  },

求个大佬帮个忙。看看这怎么解决