uniapp开发微信小程序通过 mixin 统一设置页面的分享 onShareAppMessage
最近使用uniapp 开发微信小程序的时候,,发现实现分享转发的话,要每个页面都写一个 onShareAppMessage,这样代码太臃肿,因此想起使用vue的mixins 可以设置一个全局的分享vue相关混入 (mixin)的网址:https://cn.vuejs.org/v2/guide/mixins.html实现代码如下:1、创建一个mixins,我的文件路径为 :static/js/mix
·
最近使用uniapp 开发微信小程序的时候,,发现实现分享转发的话,要每个页面都写一个 onShareAppMessage,这样代码太臃肿,因此想起使用vue的mixins 可以设置一个全局的分享
vue相关混入 (mixin) 的网址:https://cn.vuejs.org/v2/guide/mixins.html
实现代码如下:
1、创建一个 mixins
,我的文件路径为 : static/js/mixins/share.js
export default{
data(){
return {
//设置默认的分享参数
share:{
title:'ALAPI',
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'
})
}
}
}
}
2、全局使用, 在 main.js
里面 添加全局的 mixin
import share from '@/static/js/mixins/share.js'
Vue.mixin(share)
3、这样设置后,每个页面都会有分享按钮了,在页面的 data
里面设置和 mixin
一样的参数就可以修改分享的参数了
export default {
data(){
return {
//设置默认的分享参数
share:{
title:'ALAPI',
path:'/pages/index/index',
imageUrl:'',
desc:'',
content:''
}
}
},
}
更多推荐
已为社区贡献10条内容
所有评论(0)