添加分享、微信登录

This commit is contained in:
zpc 2025-07-07 14:01:37 +08:00
parent 531f29b7be
commit efa27756a8
16 changed files with 1327 additions and 643 deletions

View File

@ -259,7 +259,7 @@ class BasePlatform {
* 获取功能权限
*/
getPermission(functionName) {
return true;
return false;
}
}

View File

@ -1,7 +1,7 @@
import BasePlatform from './BasePlatform';
import eruda from 'eruda';
import { parseQueryString } from '@/common/util';
// import UniShare from 'uni_modules/uni-share/js_sdk/uni-share.js';
class H5Platform extends BasePlatform {
@ -66,16 +66,26 @@ class H5Platform extends BasePlatform {
url
}) {
console.log(`H5分享${title} - ${desc}`);
if (url.indexOf("http") == -1) {
url = window.location.origin + url;
}
// 调用浏览器原生分享(如果可用)
if (navigator.share) {
return navigator.share({
title,
navigator.share({
title: title,
text: desc,
url
});
url: url
})
.then(() => console.log('分享成功'))
.catch((error) => console.log('分享失败:', error));
return;
}
uni.setClipboardData({
data: url
});
this.$c.msg("链接已复制,快去分享吧~")
// 降级方案
alert(`请手动分享:${url}`);
// alert(`请手动分享:${url}`);
}
/**

View File

@ -1,6 +1,6 @@
import BasePlatform from './BasePlatform';
import H5Platform from './H5Platform';
import { webAppPay } from '@/common/webapp.js'
import { webAppPay, webAppShare } from '@/common/webapp.js'
import { parseQueryString } from '@/common/util'
function versionToNumber(versionString) {
@ -13,6 +13,7 @@ class NewWebAppPlatform extends H5Platform {
this.code = 'WEB_APP_ANDROID';
this.env = 'web_app';
this.app_version = 100;
this.app_os = null;
let location = window.location.href;
const params = parseQueryString(location);
@ -26,15 +27,38 @@ class NewWebAppPlatform extends H5Platform {
}
if (params['os'] != null) {
uni.setStorageSync('app_os', params['os']);
let app_os = params['os'];
uni.setStorageSync('app_os', app_os);
this.app_os = app_os;
}
if (this.app_os == null) {
if (uni.getStorageSync('app_version') != null) {
let _appversion = uni.getStorageSync('app_version') ?? "1.0.0";
if (_appversion.indexOf(".") > -1) {
_appversion = versionToNumber(_appversion);
this.app_version = _appversion;
}
}
if (uni.getStorageSync('app_os') != null) {
this.app_os = uni.getStorageSync('app_os');
}
console.log('加载数据', uni.getStorageSync('app_version'), uni.getStorageSync('app_os'));
}
}
share({ title, desc, image, url }) {
console.log(`H5分享${title} - ${desc}`);
// 调用浏览器原生分享(如果可用)
if (navigator.share) {
return navigator.share({ title, text: desc, url });
console.log(`APP分享${title} - ${desc} - ${image} - ${url}`);
if (this.app_version == 100) {
uni.setClipboardData({
data: url
});
this.$c.msg("链接已复制,快去分享吧~");
return;
}
return webAppShare(title, desc, image, url);
// 降级方案
// alert(`请手动分享:${url}`);
}
@ -112,11 +136,9 @@ class NewWebAppPlatform extends H5Platform {
wxLogin: 101
};
let _functionVersion = appPermission[functionName];
if (_functionVersion != null) {
//如果当前app权限大于等于功能权限版本则返回true
console.log('验证功能权限', functionName, _functionVersion, this.app_version, this.app_version >= _functionVersion);
console.log('验证功能权限' + functionName, "功能要求版本:" + _functionVersion, "当前app版本" + this.app_version, "当前功能是否满足:" + (this.app_version >= _functionVersion));
return this.app_version >= _functionVersion;
}
return false;

View File

@ -26,16 +26,6 @@ class WebAppPlatform extends H5Platform {
this.code = 'WEB_APP';
this.env = 'WEB_APP';
}
share({ title, desc, image, url }) {
console.log(`H5分享${title} - ${desc}`);
// 调用浏览器原生分享(如果可用)
if (navigator.share) {
return navigator.share({ title, text: desc, url });
}
// 降级方案
// alert(`请手动分享:${url}`);
}
downloadFile(url) {
return new Promise((resolve, reject) => {
try {

View File

@ -100,4 +100,83 @@ export const sendWxAppLogin = () => {
}
});
});
}
}
/**
* 分享
* @param {*} title 标题
* @param {*} desc 描述
* @param {*} image 图片
* @param {*} url 链接
* @returns
*/
export const webAppShare = (title, desc, image, url) => {
if (!window.ydsApp) {
reject('ydsApp未加载');
return;
}
let shareUrl = url;
if (shareUrl.indexOf('http') == -1) {
shareUrl = window.location.origin + url;
}
let shareData = {
content: { //公共的分享参数配置 类型type、链接herf、标题title、summary描述、imageUrl缩略图
type: 0,
href: shareUrl,
title: title,
summary: desc,
imageUrl: image + "?imageMogr2/thumbnail/108x108"
},
menus: [{
"img": "/static/app-plus/sharemenu/icon_wechat.png",
"text": "微信好友",
"share": { //当前项的分享参数配置。可覆盖公共的配置如下分享到微信小程序配置了type=5
"provider": "weixin",
"scene": "WXSceneSession"
}
}, {
"img": "/static/app-plus/sharemenu/wx_quan.png",
"text": "微信朋友圈",
"share": {
"provider": "weixin",
"scene": "WXSceneTimeline"
}
},
{
"img": "/static/app-plus/sharemenu/mp_app.png",
"text": "微信小程序",
"share": {
provider: "weixin",
scene: "WXSceneSession",
type: 5,
miniProgram: {
id: 'gh_04b8832df741',
path: url,
webUrl: shareUrl,
type: 0
},
}
},
{
"img": "/static/app-plus/sharemenu/copy.png",
"text": "复制",
"share": "copyurl"
},
{
"img": "/static/app-plus/sharemenu/more.png",
"text": "更多",
"share": "shareSystem"
}
],
cancelText: "取消分享",
}
ydsApp.postMessage({
data: {
action: 'share',
data: shareData,
}
})
}

View File

@ -29,7 +29,7 @@ export default {
return {
chaoShenIndex: -1,
prizeList: null,
mode: mode,
// mode: mode,
};
},
computed: {

View File

@ -1,24 +1,16 @@
<template>
<view class="page-container" :style="{ backgroundColor: backgroundColor }">
<nav-header
:title="navTitle"
:showBack="showBack"
:backUrl="backUrl"
:color="navColor"
:backgroundColor="navBackgroundColor"
:fixed="fixed"
:statusBar="statusBar"
:shadow="shadow"
:dark="dark"
:height="navHeight"
:leftText="leftText"
:rightText="rightText"
:leftIcon="showBack ? 'back' : ''"
@clickLeft="onClickLeft"
@clickRight="onClickRight"
@clickTitle="onClickTitle">
<nav-header :title="navTitle" :showBack="showBack" :backUrl="backUrl" :color="navColor"
:backgroundColor="navBackgroundColor" :fixed="fixed" :statusBar="statusBar" :shadow="shadow" :dark="dark"
:height="navHeight" :leftText="leftText" :rightText="rightText" :leftIcon="showBack ? 'back' : ''"
@clickLeft="onClickLeft" @clickRight="onClickRight" @clickTitle="onClickTitle">
<template #right>
<slot name="nav-right"></slot>
<view v-if="showShare">
<image src="https://image.zfunbox.cn/app/share.png" @click.stop="appShare"
style="width:24px;height:24px;">
</image>
</view>
</template>
</nav-header>
<view class="page-container__content" :style="contentStyle">
@ -36,7 +28,7 @@ export default {
components: {
NavHeader
},
emits: ['clickLeft', 'clickRight', 'clickTitle'],
emits: ['clickLeft', 'clickRight', 'clickTitle', 'appShare'],
props: {
//
title: {
@ -112,6 +104,10 @@ export default {
paddingBottom: {
type: String,
default: '0px'
},
showShare: {
type: Boolean,
default: false
}
},
data() {
@ -122,18 +118,19 @@ export default {
}
},
computed: {
//
contentStyle() {
let style = {
'padding-bottom': this.paddingBottom
};
//
// if (this.fixed) {
// let paddingTop = this.statusBar ? (this.statusBarHeight + this.navbarHeight) : this.navbarHeight;
// style['padding-top'] = paddingTop + 'px';
// }
return style;
}
},
@ -151,6 +148,9 @@ export default {
}
},
methods: {
appShare() {
this.$emit('appShare');
},
//
getStatusBarHeight() {
uni.getSystemInfo({
@ -194,13 +194,15 @@ export default {
&__divider {
width: 100%;
height: 4rpx;
background-color: #e5e5e5; /* 使用较浅的灰色 */
background-color: #e5e5e5;
/* 使用较浅的灰色 */
position: relative;
top: 0;
left: 0;
right: 0;
z-index: 1;
margin-bottom: 10rpx; /* 在分割线下方添加一些间距 */
margin-bottom: 10rpx;
/* 在分割线下方添加一些间距 */
}
}
</style>

View File

@ -2,7 +2,8 @@
盒子详情
-->
<template>
<page-container :title="$c.detailPageTitle((pageData && pageData.goods))" :showBack="true">
<page-container :title="$c.detailPageTitle((pageData && pageData.goods))" :showBack="true" showShare
@appShare="appShare">
<view class="content">
<view class="header relative" v-if="pageData && pageData.goods"
:style="{ background: 'url(' + pageData.goods.imgurl_detail + ') no-repeat 0 0 / 100% 100%', }">
@ -123,10 +124,10 @@
<buy-notice ref="buyNotice"
@confirm="$c.noDouble(confirmSubmit, [1, buyNum, true], choujiangloading)"></buy-notice>
<!-- 抽奖结果 -->
<detail-results ref="resPop" @to-bag="toBag" >
<!-- 抽奖结果 -->
<detail-results ref="resPop" @to-bag="toBag">
</detail-results>
<view v-if="aniShow" class="ani-pop">
<image :src="aniSrc" lazy-load></image>
@ -137,7 +138,7 @@
<detail-preview-popup ref="localPreviewPopup"></detail-preview-popup>
<!-- 使用抽取的老虎机组件 -->
<DetailLucky ref="detailLucky" @end="onLuckyEnd" />
<PayDialog ref="payDialog" />
</view>
</page-container>
@ -153,7 +154,7 @@ import DetailPreviewPopup from '@/components/detail-preview-popup/detail-preview
import preview from '@/components/detail-preview-popup/index.js'
//
import DetailLucky from "@/components/detail-lucky/detail-lucky.vue";
import DetailResults from '@/components/detail-results/detail-results.vue'
import { sleep } from '../../common/util'
export default {
@ -306,6 +307,25 @@ export default {
},
methods: {
getShareData() {
return {
title: this.$config.getAppSetting("app_name") +
`${this.pageData.goods.title}系列 第${this.pageData.goods.num}`,
imageUrl: this.pageData.goods.imgurl_detail,
path: '/pages/shouye/detail_wuxian' +
this.$c.qs({
goods_id: this.pageData.goods.id,
goods_num: this.pageData.goods.num,
pid: uni.getStorageSync('userinfo').ID
})
}
},
appShare() {
let data = this.getShareData();
this.$platform.share({ title: data.title, desc: data.title, image: this.pageData.goods.imgurl_detail, url: data.path });
},
onEffectSwitch(value) {
this.effectSwitch = value;
uni.setStorageSync('effectSwitch', value ? 1 : 0);

View File

@ -1,5 +1,5 @@
<template>
<page-container :title="title" :showBack="true">
<page-container :title="title" :showBack="true" showShare @appShare="appShare">
<view class="content minHeight100">
<view class="header relative" v-if="pageData && pageData.goods"
:style="{ background: 'url(' + pageData.goods.imgurl_detail + ') no-repeat 0 0 / 100% 100%' }">
@ -310,17 +310,9 @@ export default {
return co;
}
}
let shareData = this.getShareData();
return {
title: this.$config.getAppSetting("app_name") + `${this.pageData.goods.title}系列`,
imageUrl: this.pageData.goods.imgurl_detail,
path: '/pages/shouye/detail_wuxian' +
this.$c.qs({
goods_id: this.pageData.goods.id,
goods_num: this.pageData.goods.num,
pid: uni.getStorageSync('userinfo').ID
})
}
return shareData;
},
onLoad(options) {
@ -365,6 +357,22 @@ export default {
},
methods: {
getShareData() {
return {
title: this.$config.getAppSetting("app_name") + `${this.pageData.goods.title}系列`,
imageUrl: this.pageData.goods.imgurl_detail,
path: '/pages/shouye/detail_wuxian' +
this.$c.qs({
goods_id: this.pageData.goods.id,
goods_num: (this.pageData.goods.num ?? 0),
pid: uni.getStorageSync('userinfo').ID
})
}
},
appShare() {
let data = this.getShareData();
this.$platform.share({ title: data.title, desc: data.title, image: this.pageData.goods.imgurl_detail, url: data.path });
},
onEffectSwitch(value) {
this.effectSwitch = value;
uni.setStorageSync('effectSwitch', value ? 1 : 0);

View File

@ -90,10 +90,17 @@
</view>
</view>
</view>
<view v-if="$platform.getPermission('wxLogin')" style="margin-top: 10vh;text-align: center;">
<image @click="wxLogin" src="https://image.zfunbox.cn/app/wx_login.png"
style="width:36px;height:36px;"></image>
<view v-if="$platform.getPermission('wxLogin')" class="third-party-login">
<view class="divider">
<view class="line"></view>
<text>其他登录方式</text>
<view class="line"></view>
</view>
<view class="third-party-icons">
<image @click="wxLogin" src="https://image.zfunbox.cn/app/wx_login.png" class="wx-icon"></image>
</view>
</view>
</view>
</view>
<view>
@ -224,8 +231,17 @@ export default {
this.$refs.wx_login_popup.open();
return;
}
const wx_user_info = await sendWxAppLogin();
if (wx_user_info == null) {
return;
}
uni.showLoading({
title: '登录中...',
mask: true
});
const res = await wxAppLogin(wx_user_info.unionId, wx_user_info.nickName, wx_user_info.avatarUrl);
uni.hideLoading();
if (res.status == 1) {
uni.setStorageSync('token', res.data);
this.$c.msg("登录成功");
@ -421,7 +437,7 @@ export default {
console.log('重定向URL与上一页相同直接返回');
setTimeout(() => {
uni.navigateBack();
}, 1000);
}, 200);
return true;
}
}
@ -433,7 +449,7 @@ export default {
//
that.$customRouter.navigateTo('/pages/user/index')
})
}, 1000);
}, 200);
return true;
},
@ -883,4 +899,43 @@ export default {
}
}
}
//
.third-party-login {
margin-top: 80rpx;
padding: 0 40rpx;
.divider {
display: flex;
align-items: center;
margin-bottom: 40rpx;
.line {
flex: 1;
height: 1px;
background-color: #E8E8E8;
}
text {
padding: 0 20rpx;
font-size: 24rpx;
color: #999999;
}
}
.third-party-icons {
display: flex;
justify-content: center;
.wx-icon {
width: 80rpx;
height: 80rpx;
transition: transform 0.3s;
&:active {
transform: scale(0.9);
}
}
}
}
</style>

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,18 @@
## 2.0.22021-12-16
修复在某些情况下报:`Cannot read property 'hide' of undefined`的问题
## 2.0.12021-11-29
修改错误的scene值WXSenceTimeline(分享到朋友圈)更正为WXSceneTimeline
## 2.0.02021-10-14
支持监听返回操作(如:物理返回,全面屏手机侧滑)关闭分享弹窗
## 1.0.62021-08-25
兼容vue3
## 1.0.52021-08-05
优化代码实现,修改原来用`eval()`函数实现的逻辑
## 1.0.42021-06-07
为符合苹果应用市场的审核,只显示存在对应的分享客户端的选项。如:配置包含微信分享,但是用户手机上并没有安装微信,就不显示微信分享。
## 1.0.22021-05-06
修复错误的提示“打包时未添加oauth模块”
## 1.0.12021-04-30
新增完整示例
## 1.0.02021-04-28
第1版发布

View File

@ -0,0 +1,204 @@
var nvMask, nvImageMenu;
class NvImageMenu {
constructor(arg) {
this.isShow = false
}
show({
list,
cancelText
}, callback) {
if (!list) {
list = [{
"img": "/static/sharemenu/wechatfriend.png",
"text": "图标文字"
}]
}
//以下为计算菜单的nview绘制布局为固定算法使用者无关关心
var screenWidth = plus.screen.resolutionWidth
//以360px宽度屏幕为例上下左右边距及2排按钮边距留25像素图标宽度55像素同行图标间的间距在360宽的屏幕是30px但需要动态计算以此原则计算4列图标分别的left位置
//图标下的按钮文字距离图标5像素文字大小12像素
//底部取消按钮高度固定为44px
//TODO 未处理横屏和pad这些情况6个图标应该一排即可
var margin = 20,
iconWidth = 60,
icontextSpace = 5,
textHeight = 12
var left1 = margin / 360 * screenWidth
var iconSpace = (screenWidth - (left1 * 2) - (iconWidth * 4)) / 3 //屏幕宽度减去左右留白间距再减去4个图标的宽度就是3个同行图标的间距
if (iconSpace <= 5) { //屏幕过窄时,缩小边距和图标大小,再算一次
margin = 15
iconWidth = 40
left1 = margin / 360 * screenWidth
iconSpace = (screenWidth - (left1 * 2) - (iconWidth * 4)) / 3 //屏幕宽度减去左右留白间距再减去4个图标的宽度就是3个同行图标的间距
}
var left2 = left1 + iconWidth + iconSpace
var left3 = left1 + (iconWidth + iconSpace) * 2
var left4 = left1 + (iconWidth + iconSpace) * 3
var top1 = left1
var top2 = top1 + iconWidth + icontextSpace + textHeight + left1
const TOP = {
top1,
top2
},
LEFT = {
left1,
left2,
left3,
left4
};
nvMask = new plus.nativeObj.View("nvMask", { //先创建遮罩层
top: '0px',
left: '0px',
height: '100%',
width: '100%',
backgroundColor: 'rgba(0,0,0,0.2)'
});
nvImageMenu = new plus.nativeObj.View("nvImageMenu", { //创建底部图标菜单
bottom: '0px',
left: '0px',
height: (iconWidth + textHeight + 2 * margin) * Math.ceil(list.length / 4) + 44 +
'px', //'264px',
width: '100%',
backgroundColor: 'rgb(255,255,255)'
});
nvMask.addEventListener("click", () => { //处理遮罩层点击
// console.log('处理遮罩层点击');
this.hide()
callback({
event: "clickMask"
})
})
let myList = []
list.forEach((item, i) => {
myList.push({
tag: 'img',
src: item.img,
position: {
top: TOP['top' + (parseInt(i / 4) + 1)],
left: LEFT['left' + (1 + i % 4)],
width: iconWidth,
height: iconWidth
}
})
myList.push({
tag: 'font',
text: item.text,
textStyles: {
size: textHeight
},
position: {
top: TOP['top' + (parseInt(i / 4) + 1)] + iconWidth + icontextSpace,
left: LEFT['left' + (1 + i % 4)],
width: iconWidth,
height: textHeight
}
})
})
//绘制底部图标菜单的内容
nvImageMenu.draw([{
tag: 'rect', //菜单顶部的分割灰线
color: '#e7e7e7',
position: {
top: '0px',
height: '1px'
}
},
{
tag: 'font',
text: cancelText, //底部取消按钮的文字
textStyles: {
size: '14px'
},
position: {
bottom: '0px',
height: '44px'
}
},
{
tag: 'rect', //底部取消按钮的顶部边线
color: '#e7e7e7',
position: {
bottom: '45px',
height: '1px'
}
},
...myList
])
nvMask.show()
nvImageMenu.show()
// 开始动画
/*
plus.nativeObj.View.startAnimation({
type: 'slide-in-bottom',
duration: 300
}, nvImageMenu, {}, function() {
console.log('plus.nativeObj.View.startAnimation动画结束');
// 关闭原生动画
plus.nativeObj.View.clearAnimation();
nvImageMenu.show()
});
*/
this.isShow = true
nvImageMenu.addEventListener("click", e => { //处理底部图标菜单的点击事件,根据点击位置触发不同的逻辑
// console.log("click menu"+JSON.stringify(e));
if (e.screenY > plus.screen.resolutionHeight - 44) { //点击了底部取消按钮
// callback({event:"clickCancelButton"})
this.hide()
} else if (e.clientX < 5 || e.clientX > screenWidth - 5 || e.clientY < 5) {
//屏幕左右边缘5像素及菜单顶部5像素不处理点击
} else { //点击了图标按钮
var iClickIndex = -1 //点击的图标按钮序号第一个图标按钮的index为0
var iRow = e.clientY < (top2 - (left1 / 2)) ? 0 : 1
var iCol = -1
if (e.clientX < (left2 - (iconSpace / 2))) {
iCol = 0
} else if (e.clientX < (left3 - (iconSpace / 2))) {
iCol = 1
} else if (e.clientX < (left4 - (iconSpace / 2))) {
iCol = 2
} else {
iCol = 3
}
if (iRow == 0) {
iClickIndex = iCol
} else {
iClickIndex = iCol + 4
}
// console.log("点击按钮的序号: " + iClickIndex);
// if (iClickIndex >= 0 && iClickIndex <= 5) { //处理具体的点击逻辑,此处也可以自行定义逻辑。如果增减了按钮,此处也需要跟着修改
// }
callback({
event: "clickMenu",
index: iClickIndex
})
}
})
/* nvImageMenu.addEventListener("touchstart", function(e) {
if (e.screenY > (plus.screen.resolutionHeight - 44)) {
//TODO 这里可以处理按下背景变灰的效果
}
})
nvImageMenu.addEventListener("touchmove", function(e) {
//TODO 这里可以处理按下背景变灰的效果
if (e.screenY > plus.screen.resolutionHeight - 44) {}
})
nvImageMenu.addEventListener("touchend", function(e) {
//TODO 这里可以处理释放背景恢复的效果
})
*/
}
hide() {
if (this.isShow) {
nvMask.hide()
nvImageMenu.hide()
this.isShow = false
}
}
}
export default NvImageMenu

View File

@ -0,0 +1,98 @@
import UniImageMenu from './uni-image-menu.js';
class UniShare extends UniImageMenu{
constructor(arg) {
super()
this.isShow = super.isShow
}
async show(param, callback){
var menus = []
plus.share.getServices(services => { //只显示有服务的项目
services = services.filter(item => item.nativeClient)
let servicesList = services.map(e => e.id)
param.menus.forEach(item => {
if (servicesList.includes(item.share.provider) || typeof(item.share) == 'string') {
menus.push(item)
}
})
super.show({
list: menus,
cancelText: param.cancelText
}, e => {
callback(e)
if(e.event == 'clickMenu'){
if (typeof(menus[e.index]['share']) == 'string') {
this[menus[e.index]['share']](param)
} else {
uni.share({
...param.content,
...menus[e.index].share,
success: res=> {
console.log("success:" + JSON.stringify(res));
super.hide()
},
fail: function(err) {
console.log("fail:" + JSON.stringify(err));
uni.showModal({
content: JSON.stringify(err),
showCancel: false,
confirmText: "知道了"
});
}
})
}
}
})
}, err => {
uni.showModal({
title: '获取服务供应商失败:' + JSON.stringify(err),
showCancel: false,
confirmText: '知道了'
});
console.error('获取服务供应商失败:' + JSON.stringify(err));
})
}
hide(){
super.hide()
}
copyurl(param) {
console.log('copyurl',param);
uni.setClipboardData({
data: param.content.href,
success: ()=>{
console.log('success');
uni.hideToast() //关闭自带的toast
uni.showToast({
title: '复制成功',
icon: 'none'
});
super.hide();
},
fail: (err) => {
uni.showModal({
content: JSON.stringify(err),
showCancel: false
});
}
});
}
// 使用系统分享发送分享消息
shareSystem(param) {
console.log('shareSystem',param);
plus.share.sendWithSystem({
type: 'text',
content: param.content.title + param.content.summary || '',
href: param.content.href,
}, (e)=> {
console.log('分享成功');
super.hide()
}, (err)=> {
console.log('分享失败:' + JSON.stringify(err));
uni.showModal({
title: '获取服务供应商失败:' + JSON.stringify(err),
showCancel: false,
confirmText: '知道了'
});
});
}
}
export default UniShare

View File

@ -0,0 +1,80 @@
{
"id": "uni-share",
"displayName": "uni-share",
"version": "2.0.2",
"description": "底部弹出宫格图标式的分享菜单,可覆盖原生组件。",
"keywords": [
"分享菜单"
],
"repository": "",
"engines": {
"HBuilderX": "^3.1.0"
},
"dcloudext": {
"category": [
"JS SDK",
"通用 SDK"
],
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": ""
},
"uni_modules": {
"dependencies": [],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
},
"client": {
"App": {
"app-vue": "y",
"app-nvue": "y"
},
"H5-mobile": {
"Safari": "n",
"Android Browser": "n",
"微信浏览器(Android)": "n",
"QQ浏览器(Android)": "n"
},
"H5-pc": {
"Chrome": "n",
"IE": "n",
"Edge": "n",
"Firefox": "n",
"Safari": "n"
},
"小程序": {
"微信": "n",
"阿里": "n",
"百度": "n",
"字节跳动": "n",
"QQ": "n"
},
"快应用": {
"华为": "n",
"联盟": "n"
},
"Vue": {
"vue2": "y",
"vue3": "y"
}
}
}
}
}

View File

@ -0,0 +1,95 @@
#### 本功能基于[底部图标菜单](https://ext.dcloud.net.cn/plugin?id=4858)封装而成。
### 示例代码
```
<template>
<button type="default" @click="uniShare">显示</button>
</template>
<script>
import uniShare from '@/uni_modules/uni-share/js_sdk/uni-share.js';
export default {
onBackPress({from}) {
console.log(from);
if(from=='backbutton'){
this.$nextTick(function(){
uniShare.hide()
})
return uniShare.isShow;
}
},
methods: {
uniShare() {
uniShare.show({
content: { //公共的分享参数配置 类型type、链接herf、标题title、summary描述、imageUrl缩略图
type: 0,
href: 'https://uniapp.dcloud.io/',
title: '标题',
summary: '描述',
imageUrl: 'https://img-cdn-aliyun.dcloud.net.cn/stream/icon/__UNI__HelloUniApp.png'
},
menus: [{
"img": "/static/app-plus/sharemenu/wechatfriend.png",
"text": "微信好友",
"share": { //当前项的分享参数配置。可覆盖公共的配置如下分享到微信小程序配置了type=5
"provider": "weixin",
"scene": "WXSceneSession"
}
},
{
"img": "/static/app-plus/sharemenu/wechatmoments.png",
"text": "微信朋友圈",
"share": {
"provider": "weixin",
"scene": "WXSceneTimeline"
}
},
{
"img": "/static/app-plus/sharemenu/mp_weixin.png",
"text": "微信小程序",
"share": {
provider: "weixin",
scene: "WXSceneSession",
type: 5,
miniProgram: {
id: '123',
path: '/pages/list/detail',
webUrl: '/#/pages/list/detail',
type: 0
},
}
},
{
"img": "/static/app-plus/sharemenu/weibo.png",
"text": "微博",
"share": {
"provider": "sinaweibo"
}
},
{
"img": "/static/app-plus/sharemenu/qq.png",
"text": "QQ",
"share": {
"provider": "qq"
}
},
{
"img": "/static/app-plus/sharemenu/copyurl.png",
"text": "复制",
"share": "copyurl"
},
{
"img": "/static/app-plus/sharemenu/more.png",
"text": "更多",
"share": "shareSystem"
}
],
cancelText: "取消分享",
}, e => { //callback
console.log(uniShare.isShow);
console.log(e);
})
}
}
}
</script>
```