1.在微信小程序中,可以很简单的分享一个页面,比微信H5简单多了,然而,分享出去的页面(也叫卡片),打开后只是一个单独的页面,没有底部导航栏,点击返回按钮的时候就直接退出小程序了。如果需要去到首页,还必须点击顶部胶囊的“回到首页”,可是该功能很少人知道。
2.为了解决这个问题,有两种解决方案。
3.第一种:在分享的页面在添加显眼的“首页”悬浮按钮,点击按钮跳转到首页。这种方法,好容易理解,可是万一页面多,需要开发不少这样的悬浮按钮,而且点击返回依旧是退出小程序。
4.第二种:分享的时候不是分享本页面,而是分享首页的链接,不过在链接上带上本页面的参数,打开卡片号进入首页,首先判断参数,符合要求的直接跳转到目标页面。这个的好处是不需要修改ui效果,只需要在分享接口上做些处理,而且还支持返回首页;缺点是会从首页一闪到目标页面。
5.同时,如果小程序涉及到分享功能的,需要记录我是谁邀请进来的,那么就需要在分享参数中加上自己的分享id,综合考虑后第二种方式更合适。
第一步:创建分享配置文件pageshare.js6.该文件的模块包含五个属性,分别是config数组(页面路径和页面id数组)、find方法(通过id查找页面路径的方法)、build(创建分享参数的方法,如返回页面id、分享id、文章id等)、baseshare(基础分享方法,返回微信分享所需的对象)
7.module.exports{
8.config:[{
9.pageId:1,
10.pageUrl:"/pages/home/home",
11.isTab:true,
12.isHome:true
13.}],
14./**
15.*查找相应的页面
16.*@pageId页面id
17.*/
18.find:function(pageId){
19.letresultthis.config[0];
20.this.config.forEach(item{
21.if(item.pageId.toString()pageId.toString()){
22.resultitem;
23.}
24.});
25.returnresult;
26.},
27./**
28.*创建分享参数
29.*@obj分享键值对
30.*[默认内置salesmanId或shareId]
31.*/
32.build:function(obj){
33.if(!(objinstanceofObject)){
34.obj{};
35.}
36.letuserInfogetApp().globalData.userInfo;
37.if(userInfo.is_salesman){
38.obj.salesmanIduserInfo.salesman_info.id;
39.}else{
40.obj.shareIduserInfo.id;
41.}
42.letparams[];
43.for(letnameinobj){
44.params.push(name+""+obj[name]);
45.}
46.returnparams.join("");
47.},
48./**
49.*基础分享
50.*@title标题
51.*@paramsurl参数
52.*@imageUrl图片[默认截图]
53.*/
54.baseshare:function({
55.title,
56.params,
57.imageUrl
58.}){
59.return{
60.title:title,
61.path:"/pages/home/home?"+this.build(params),
62.imageUrl:imageUrl||""
63.}
64.}
65.}
66.PS:config与小程序的页面一一对应,需要手动配置。
第二步:引入pageshare.js文件67.constPagesharerequire("../../../utils/pageshare");//在需要做分享的页面引入该文件
第三步:配置分享信息68.在需要做分享的页面中修改分享信息
69.onShareAppMessage:function(){
70.returnPageshare.baseshare({
71.title:this.data.course.title,//标题
72.params:{
73.pageId:12,//页面id
74.source:"微信小程序课程分享",//自定义参数
75.id:this.data.course.id//自定义参数
76.}
77.});
78.}
79.pageshare底层默认添加了分享人等基本参数,所以这里不需要添加
第四步:App.js获取页面参数(点击卡片打开时)80.在用户B点击用户A分享的链接时,app.js触发以下代码
app中获取请求参数app.js登录接口中提交分享人信息81.到这里完成了分享人信息的绑定。
第五步:home页面获取到请求参数,进行二次跳转82.从分享配置中可以知道,分享的路径是首页,然后带上自定义参数和分享参数
底层分享83.那么用户B打开用户A发的链接时,会打开home页面,所以我们在home中做参数判断,如下:
home.jsonLoad中处理参数home.js分享页面重定向配置84.shareRedirect:function(share){
85.if(share.pageId!null){
86.letsharePagePageshare.find(share.pageId);
87.letparams[];
88.for(letnameinshare){
89.if(name!"pageId"){
90.params.push(name+""+share[name]);
91.}
92.}
93.if(sharePage.isTab!sharePage.isHome){
94.wx.switchTab({
95.url:sharePage.pageUrl+"?"+params.join("")
96.});
97.}else{
98.wx.navigateTo({
99.url:sharePage.pageUrl+"?"+params.join("")
100.});
101.}
102.}
103.}
微信小程序封装分享与分销功能-小程序的二级分销-小程序分销系统开发
浏览量:1900
时间:
来源:Msgyvcici
版权声明
即速应用倡导尊重与保护知识产权。如发现本站文章存在版权问题,烦请提供版权疑问、身份证明、版权证明、联系方式等发邮件至197452366@qq.com ,我们将及时处理。本站文章仅作分享交流用途,作者观点不等同于即速应用观点。用户与作者的任何交易与本站无关,请知悉。
最新资讯
-

即速应用,赋能企业玩转微信小程序智慧经营
作为国内领军的智慧商业经营服务商,即速应用始终秉承“让每个企业都拥有自己的智慧店铺”的愿景,持续赋能更多企业玩转智慧经营。即速应用旗下拥有“小程序搭建工具-即速应用”、“私域流量专家-即客云”等产品,帮助商家打通互联网全生态营销闭环。 -

即客云2.0重磅更新,让微信小程序运营更简单!
即客云作为一款基于企业微信的第三方工具,现从多维度提供超过30种功能,自上线以来,已服务多家企业,受到一致好评。近期,我们根据客户反馈和市场调研正式推出升级版 即客云2.0!更新了私域运营SOP,群日历功能,批量拓客,客户雷达,消息推送,个人欢迎语,帮助企业更好运用企业微信;同时提升了社群运营工作标准化,提升运营效率,帮助企业实现客户增长,玩转私域流量。 -

零代码 + AI 双轮驱动|即速应用解锁人工智能小程序开发新范式
无需代码、无需 AI 算法功底,普通人也能快速搭建智能小程序。即速应用将人工智能与零代码开发深度融合,推出 AI 智能生成能力,用户通过自然语言描述需求,AI 自动生成小程序页面、功能模块与后台配置,覆盖商城、预约、同城、社区团购等全场景。平台内置 AI 智能推荐、智能客服、用户画像分析等能力,一键对接微信生态,打通视频号、企业微信、短信跳转,帮企业快速落地 AI 应用,抢占智慧经营先机,让每家企业都拥有 AI 驱动的智慧店铺。











