在【商品列表页面】分享【商品详情】----网易手推公众号效果

1,制作一个分享的js接口

可参考:http://blog.csdn.net/m0_38082783/article/details/73326551

假如接口为:

 

wxShare({
	title: '', // 分享标题  
	desc: '', // 分享描述  
	link: '', // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致  
	imgUrl: '', // 分享图标  
	success: function () {   
	    // 用户确认分享后执行的回调函数  
	},  
	cancel: function () {   
	    // 用户取消分享后执行的回调函数  
	}  
});

 

2,制作商品列表页面的分享

 

(function(){
	var listShareObj = {
		title: '', // 分享标题  
		desc: '', // 分享描述  
		link: '', // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致  
		imgUrl: '', // 分享图标   
	}
	
	wxShare(listShareObj);
	
	//商品列表中商品分享按钮调用的函数goodsDetailShare
	window.goodsDetailShare = function(){
		var goodShareObj = {
			title: '', // 分享标题  
			desc: '', // 分享描述  
			link: '', // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致  
			imgUrl: '', // 分享图标 
			success: function(){
				//分享成功后,还原商品列表页面的列表分享
				wxShare(listShareObj);
			},
			cancel: function(){
				//分享取消后,还原商品列表页面的列表分享
				wxShare(listShareObj);
			}
		}
		//此时微信分享按钮分享的是详情商品
		wxShare(goodShareObj);
	}
})()


注意:

 

1,此处只做了图片,url,标题,描述的分享

2,进入商品列表页面必须执行一次分享按钮的赋值,这是赋值的是列表页面的图片,url,标题,描述的分享

3,点击具体的商品分享,将要分享的图片,url,标题,描述都放在自定义属性,然后调用goodsDetailShare函数

4,在goodsDetailShare函数中分享商品的图片,url,标题,描述

5,同时在分享中的取消和成功函数中再次做第一步列表页面的分享

6,循环完成

页面分享 ---- 商品详情分享 ---- 在成功和取消函数中再次做(页面分享)

第五步必须执行,否则列表页面的分享不能还原!重要的事情说三遍,重要的事情说三遍,重要的事情说三遍!

特别注意:

分享的url必须是你公众号域名下的url,否则不会执行!重要的事情说三遍,重要的事情说三遍,重要的事情说三遍!

 

### 其他

[我的博客,欢迎交流!](http://rattenking.gitee.io/stone/index.html)

[我的CSDN博客,欢迎交流!](https://blog.csdn.net/m0_38082783)

[微信小程序专栏](https://blog.csdn.net/column/details/18335.html)

[前端笔记专栏](https://blog.csdn.net/column/details/18321.html)

[微信小程序实现部分高德地图功能的DEMO下载](http://download.csdn.net/download/m0_38082783/10244082)

[微信小程序实现MUI的部分效果的DEMO下载](http://download.csdn.net/download/m0_38082783/10196944)

[微信小程序实现MUI的GIT项目地址](https://github.com/Rattenking/WXTUI-DEMO)

[微信小程序实例列表](http://blog.csdn.net/m0_38082783/article/details/78853722)

[前端笔记列表](http://blog.csdn.net/m0_38082783/article/details/79208205)

[游戏列表](http://blog.csdn.net/m0_38082783/article/details/79035621)

posted @ 2017-10-11 15:14  Newman·Li  阅读(456)  评论(0编辑  收藏  举报