我们在用 uni-app 开发微信小程序时,我们有时需要分享功能,uni-app 中只要在需要分享的页面的 js 中定义了 onShareAppMessage
(和 onLoad 等生命周期函数同级),就能实现 发送给朋友
微信小程序的分享功能。但是如果每个需要分享的页面都写一个 onShareAppMessage
,冗余代码就太多了。本文介绍通过 mixins(混入)
的方式来实现。
如果对 mixins
不了解的,可以先看这篇文章初步了解下:vue 中 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>
<script>
import { shareMixins} from '@/mixins/share'
export default {
mixins: [ shareMixins],
data() {
return {
shareData: {
title: '我是分享标题',
path: '/pages/index/index?id=1' // 分享的页面路径
}
}
},
methods: {
}
}
</script>
官方文档:onShareAppMessage(OBJECT)
如果你的小程序所有页面都需要用到分享功能,可以通过 mixins
的全局混入来实现。具体实现方式大家可以自己动动手。
版权属于:瞭月
本文链接:https://www.lervor.com/archives/176/
版权声明:本文为瞭月原创文章,转载请附上原文出处链接和本声明。