unibest/src/pages/index/demo/mp-weixin-share.vue

38 lines
1.3 KiB
Vue
Raw Normal View History

2024-01-09 09:34:45 +08:00
<route lang="json5">
{
style: { navigationBarTitleText: '微信分享' },
}
</route>
2024-01-08 21:24:39 +08:00
<template>
<view class="m-10 text-center">
2024-01-09 09:45:13 +08:00
<view class="text-green">微信分享页</view>
<view class="text-green-500">请在微信小程序中体验或者开发者工具</view>
<view>1) 默认是不激活发送给朋友分享到朋友圈如下图</view>
<image src="/static/screenshots/wx-share-before.png" mode="widthFix" />
<view>2) 增加了onShareAppMessage和onShareTimeline后就可以微信分享了如下图</view>
<image src="/static/screenshots/wx-share-after.png" mode="widthFix" />
2024-01-08 21:24:39 +08:00
</view>
</template>
<script lang="ts" setup>
import { onShareAppMessage, onShareTimeline } from '@dcloudio/uni-app'
/** 激活“分享给好友” */
onShareAppMessage((options: Page.ShareAppMessageOption): Page.CustomShareContent => {
console.log('options:', options)
return {
title: '自定义分享标题',
path: '/pages/index/index?id=xxx',
imageUrl:
'https://cip-shopping-page-0eysug01066a9e-1302818703.tcloudbaseapp.com/pretty-girl.png',
}
})
/** 激活“分享到朋友圈”, 注意:需要先激活“分享给好友” */
onShareTimeline((): Page.ShareTimelineContent => {
return {
title: '自定义分享标题',
query: 'a=1&b=2',
}
})
</script>