小程序之如何从分享的二级页面返回首页

解决内层页面分享出去后,用户无法通过分享页面返回首页的问题

本质就是设置一个变量isshare来判断是否是分享页面中进入的

data设置

Page({
   data: {

        isShare : false, //标识是否是从分享进入的小程序
        /*
        *下面写你自己需要的其他变量
        */
   },

   onLoad(options) {
    //如果是从分享页面进入,则修改标识
     if(options.isshare == 1){
         this.setData({
           isShare : true
          })
      }
   },

/* 分享给朋友 */
   onShareAppMessage() {
    return {
      title: '这里写上分享的文案!',
      path: 'pages/report/report?isshare=1' //这里写当前页面的路径,后面带上参数isshare=1
    }
  },

/* 分享至朋友圈 */
  onShareTimeline(){
    return{
      title: '这里写上分享的文案!',
      path: 'pages/report/report?isshare=1'
    }
  },

/* 
  *返回上一级页面
  *因为分享出去的页面,没有带上一级页面,所以不能直接返回 
*/
  BackPage() {
    wx.navigateBack({
      delta: 1
     })
  },

/* 分享页面的返回按钮,实际上是关闭其他页面,直接打开首页 */
  toHome() {
    wx.reLaunch({
      url: '/pages/index/index'
    })
  },

/* 其他代码 */

})

wxml

<image bindtap="{
    
    {isShare? 'toHome':'BackPage'}}" class='d-back-home' src='http://cdn.xcx.pemarket.com.cn/icon-Return%20to%20the%20home%20page.png' lazy-load></image>

WXSS

/* 返回按钮,固定定位,悬浮 */
.d-back-home {
  position: fixed;
  width: 96rpx;
  height: 96rpx;
  right: 30rpx;
  bottom: 166rpx;
  z-index: 10000;
}

说明:实际开发中,我的返回按钮做了一些封装,上面代码只是为了说明问题,不是效果图的实际代码。

猜你喜欢

转载自blog.csdn.net/laya1211/article/details/129613417
今日推荐