最近在通过uniapp 写小程序,接口来自 www.alapi.cn 的数据,因为设置分享的话,要每个页面都写一个
onShareAppMessage
这样太麻烦了,就查了下资料,通过mixins
可以设置一个全局的分享
混入 (mixin)
混入 (mixin) 提供了一种非常灵活的方式,来分发 Vue 组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时,所有混入对象的选项将被“混合”进入该组件本身的选项。
from:https://cn.vuejs.org/v2/guide/mixins.html
代码
创建一个 mixins
,我的文件路径为 : static/js/mixins/base.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'
})
}
}
}
}
全局使用, 在 main.js
里面 添加全局的 mixin
import mixin from '@/static/js/mixins/base.js'
Vue.mixin(mixin)
这样设置后,每个页面都会有分享按钮了,在页面的 data
里面设置和 mixin
一样的参数就可以修改分享的参数了
export default {
data(){
return {
//设置默认的分享参数
share:{
title:'ALAPI',
path:'/pages/index/index',
imageUrl:'',
desc:'',
content:''
}
}
},
}
One comment
不错,试试