uniapp 微信小程序 全局点亮所有页面的 ‘发送给朋友‘ 和 ‘分享朋友圈‘,mixin

小程序离不了分享,但默认是没有办法进行分享发送的,需要在页面进行配置

局部配置

在页面下,和data同级

onShareAppMessage(){//点亮发送给朋友
	return {
      title: '自定义转发标题',//标题
      path: '/page/user?id=123'//路径
    }
},
onShareTimeline() {}//点亮分享朋友圈,暂只支持Android平台

全局配置

原生微信小程序写法

把下面的代码加到app.js的开头

!function(){
  var PageTmp = Page;
 
  Page =function (pageConfig) {
     
    // 设置全局默认分享
    pageConfig = Object.assign({
      onShareAppMessage:function () {
        return {
          title:'默认文案',
          path:'默认分享路径+id',
          imageUrl:'默认分享图片',
        };
      }
    },pageConfig);
 
    PageTmp(pageConfig);
  };
}();

uniapp写法

1. 新建一个js文件,内容如下

export default {
	data() {
		return {
			//设置默认的分享参数
			share: {
				title: '万景千言智慧旅游',
				path: '/pages/index/index',
				imageUrl: '',
				desc: '',
				content: ''
			}
		}
	},
	onShareAppMessage(res) {
		return {
			title: this.share.title,
			path: this.share.path,
			imageUrl: this.share.imageUrl,
			desc: this.share.desc,
			content: this.share.content,
			success(res) {
				uni.showToast({
					title: '分享成功'
				})
			},
			fail(res) {
				uni.showToast({
					title: '分享失败',
					icon: 'none'
				})
			}
		}
	},
	onShareTimeline() {},
}

2. 在main.js中引入

import share from 'static/share.js'//我命名为share.js
Vue.mixin(share)

3. 这样设置后，每个页面都会有分享按钮了,在页面的 data 里面设置和 mixin 一样的参数就可以修改分享的参数了

export default {
data(){
        return { //设置默认的分享参数
            share:{
                title:'新的标题',
                path:'/pages/index/index',
                imageUrl:'',
                desc:'',
                content:''
            }
        }
    }
}

vue相关混入 (mixin) 的网址：https://cn.vuejs.org/v2/guide/mixins.html