uni-app 微信小程序实现“发送给朋友”分享功能

朱雀 2021-03-23 10:37 1586阅读 0赞

我们在用 uni-app 开发微信小程序时，我们有时需要分享功能，uni-app 中只要在需要分享的页面的 js 中定义了 `onShareAppMessage`（和 onLoad 等生命周期函数同级），就能实现 `发送给朋友` 微信小程序的分享功能。但是如果每个需要分享的页面都写一个 `onShareAppMessage`，冗余代码就太多了。本文介绍通过 `mixins（混入）` 的方式来实现。

**步骤1：创建一个 mixins 文件（如本例该文件 share.js 存放在在根目录下的文件夹 mixins 中）**

```
export const shareMixins = {
    data () {
        return {
            shareData: {
                title: '',
                path: '',
                imageUrl: '',
                content: '',
                desc: ''
            }
        }
    },

//#ifdef MP-WEIXIN
    onShareAppMessage () {
        return {
            title: this.shareData.title,
            path: this.shareData.path,
            imageUrl: this.shareData.imageUrl,
            content: this.shareData.content,
            desc: this.shareData.desc,
            success: res => {
                console.info(res)
            }
        }
    },
    //#endif

onLoad(option) {
    }
}
```

**步骤2：在需要分享的页面中引入这个 mixins 对象**

```
<template>
    <view></view>
</template>