简要记录一下uniapp微信。QQ分享的过程!

1.manifest.json配置:

将自己申请好的Id,填到配置文件中:
截图示例

2.在page.json中添加个小图标:

       {
		    "path" : "pages/instrument/diary/diary",
		    "style" : {
				"navigationBarTitleText": "施工日志",
				"app-plus": {
					   "scrollIndicator":"none",// 移动端去掉滚动条
					   "titleNView": {
					       "buttons": [
					           {
					               "text": "\ue7c5",
					               "fontSrc": "/static/iconfont.ttf",
					               "fontSize": "18px"
					           }
					       ]
					   }
				   }
			}
		}

来张效果图;(右边小图标)
分享按钮图标

3.给小图标个点击事件:

备注:这里要用到uniapp自带方法哦!

onNavigationBarButtonTap() {
//这里可以根据需求,跳转页面或者直接打开分享的弹框即可!
//我是直接跳转页面了,在跳转后的页面实现分享链接
     	uni.navigateTo({
     		url:"../../share/shareApp"
     	})
},

4.微信分享,或者QQ分享:

分享

给各自图标加点击方法:

toShireqq(){
				let that = this
				let url = that.$http.shareUrl+that.accountId
				//判断是不是ios,苹果登录(发现的bug,如果不判断另外一个就无法分享)
				if(uni.getSystemInfoSync().platform =='ios'){
					uni.share({
					    provider: "qq",
					    scene: "WXSceneSession",
					    type: 1,
					    summary:'这里是发送出去的话加上可以点击的h5页面!'+ url,
					    success: function (res) {
					       that.$refs.popup.close()
					    },
					    fail: function (err) {
					        console.log("fail:" + JSON.stringify(err));
					    }
					});
				}else{
					uni.share({
						provider: "qq",
						scene: "WXSceneSession",
						title:'建助江湖',
						type: 1,
						href:url,
						summary:'这里是发送出去的话加上可以点击的h5页面!!'+ url,
						success: function (res) {
						   that.$refs.popup.close()
						},
						fail: function (err) {
							console.log("fail:" + JSON.stringify(err));
						}
					});	
				}
			},
			toShirewx(){
				let that = this
				let url = that.$http.shareUrl+that.accountId
				uni.share({
				    provider: "weixin",
				    scene: "WXSceneSession",
				    type: 1,
				    summary: '这里是发送出去的话加上可以点击的h5页面'+ url,
				    success: function (res) {
				       that.$refs.popup.close()
				    },
				    fail: function (err) {
				        console.log("fail:" + JSON.stringify(err));
				    }
				});
			},

到此结束分享!代码既粘即用。没有bug。如有问题,评论说明!!!!

©️2020 CSDN 皮肤主题: 游动-白 设计师:上身试试 返回首页