如何简单的让小程序的分享页拥有返回按钮

我会带着你远行 2022-05-11 07:48 235阅读 0赞

# 如何简单的让小程序的分享页拥有返回按钮 #

## 分享 ##

可以分享小程序的任何一个页面给好友或群聊。注意是分享给好友或群聊，并没有分享到朋友圈。一方面微信在尝试流量分发方式，但同时又不愿意开放最大的流量入口。

开发文档：[https://mp.weixin.qq.com/debug/wxadoc/dev/api/share.html?t=20161221][https_mp.weixin.qq.com_debug_wxadoc_dev_api_share.html_t_20161221]

示例代码：

Page({
    
        onShareAppMessage: function () {
    
            return {
    
                title: '自定义分享标题',
    
                desc: '自定义分享描述',
    
                path: '/page/user?id=123',
                
                imageUrl: ''
    
            }
    
        }
    
    )}

通常小程序的分享页面被再次打开的时候是这样的   
![70][]

而正常的页面左上角是有返回上一步的返回按钮的

![70 1][]

然而如何在小程序的分享页拥有返回按钮呢？？？

看到网上有一个思想 拿来借用一下   
先进入首页的流程,再跳转进入对应的分享页面,这样进入分享页之后左上角就会有回到主页的返回按钮,相比于让用户熟悉小程序的回首页交互,这样更为合理.

--------------------

**下面来写下具体的实现步骤**   
要分享的页面positionDetail.js

onShareAppMessage: function () {
        let positionId = this.data.positionId
        return {
            title: dataMsg.title,
            path: 'pages/index/index?positionId=' + positionId  // 当打开分享链接的时候跳转到小程序首页，并设置参数positionId
        }
    },

小程序首页index.js

onLoad: function (options) {
        ......
        // 打开首页时判断options.positionId是否存在 用这个值来判断进入首页的来源是否为用户点击了分享的卡片
        // 同时可以通过获取到的positionId的值跳转导航到对应的分享详情页
        if (options.positionId) {
            setTimeout(function(){
                wx.navigateTo({
                    url: '../positionDetail/positionDetail?id=' + options.positionId
                })
            }, 800)
        }
    },

[https_mp.weixin.qq.com_debug_wxadoc_dev_api_share.html_t_20161221]: https://mp.weixin.qq.com/debug/wxadoc/dev/api/share.html?t=20161221
[70]: /images/20220511/2e31d0c1722645dc9803030bddabf521.png
[70 1]: /images/20220511/2c464265b3da4030ae0fc0ee0d41a2fc.png