一般情况下是这样来写的，不过感觉太麻烦，每个页面都要写一次
<template>
<view></view>
</template>
<script>
export default {
data() {
return {}
},
onLoad() {},
methods: {},
// 分享给好友
onShareAppMessage(res) {
console.log(res);
if (res.from === 'button') { // 来自页面内分享按钮
console.log(res.target)
}
return {
title: 'title', //自定义分享标题
path: 'path', // '/pages/...'分享页面路径（打开分享时进入页），以/开头
imageUrl: '', //可设置默认分享图，不设置默认截取头部5:4
}
},
// 分享朋友圈
onShareTimeline(res) {
console.log(res);
return {
//同上
}
}
}
</script>
<style></style>所以这里我进行了封装
封装share.js代码
export default {
data() {
return {
//设置默认的分享参数
//如果页面不设置share，就触发这个默认的分享
share: {
title: '',//自定义标题
path: `/pages/index/index`, //默认跳转首页
imageUrl: '', //可设置默认分享图，不设置默认截取头部5:4
}
}
},
onShareAppMessage(res) { //发送给朋友
let that = this
// 动态获取当前页面栈
let pages = getCurrentPages(); //获取所有页面栈实例列表
console.log(pages,'所有页面')
let nowPage = pages[pages.length - 1]; //当前页页面实例
// let prevPage = pages[pages.length - 2]; //上一页页面实例
that.share.path = `/${nowPage.route}`
return {
title: this.share.title,
path: this.share.path,
imageUrl: this.share.imageUrl,
success(res) {
console.log('success(res)==', res);
uni.showToast({
title: '分享成功'
})
},
fail(res) {
console.log('fail(res)==', res);
uni.showToast({
title: '分享失败',
icon: 'none'
})
}
}
},
onShareTimeline(res) { //分享到朋友圈
let that = this
// 动态获取当前页面栈
let pages = getCurrentPages(); //获取所有页面栈实例列表
let nowPage = pages[pages.length - 1]; //当前页页面实例
// let prevPage = pages[pages.length - 2]; //上一页页面实例
that.share.path = `/${nowPage.route}`
return {
title: this.share.title,
path: this.share.path,
imageUrl: this.share.imageUrl,
success(res) {
console.log('success(res)==', res);
uni.showToast({
title: '分享成功'
})
},
fail(res) {
console.log('fail(res)==', res);
uni.showToast({
title: '分享失败',
icon: 'none'
})
}
}
},
}挂载到main.js
// 全局分享
// 小程序分享的封装
import share from "./utils/share.js"
Vue.mixin(share)这样就实现了效果图如下！！！文章来源：https://www.toymoban.com/news/detail-504007.html
文章来源地址https://www.toymoban.com/news/detail-504007.html
uniapp编译判断
https://blog.csdn.net/weixin_41891519/article/details/104365609到了这里，关于uniapp实现小程序分享功能的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
