uniapp开发微信小程序通过 mixin 统一设置页面的分享 onShareAppMessage

最近使用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:''
            }
        }
    },
}