使用uniapp开发微信小程序时,小程序自带的转发给朋友和转发到朋友圈功能默认是灰色禁用的,点击会提示“此页面未配置分享功能”
解决方法为在每个page页面的script中(和生命周期函数同级)添加以下代码:
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);
};
}();
或者也可以使用代码混入,可以把js当做组件在每个页面引用,也可以在main.js中全局混入:
新建share.js文件,内容如下:
export default {
data() {
return {
//设置默认的分享参数
share: {
title: '辰雪博客',
path: '/pages/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() {},
}
1.单独混入:
import share from '@/libs/mixin/share.js'
export default {
name: 'TemplateTest',
mixins: [share],
data() {
return {
}
}
}
2.全局混入:
在main.js中引入:
import share from '@/libs/mixin/share.js'
Vue.mixin(share)
任意方式添加 onShareAppMessage 和 onShareTimeline方法后,微信小程序自带的分享功能就被点亮了。
如果还是不可以状态,请检查小程序是否已完成微信认证。