uniapp微信小程序点击右上角菜单分享功能权限配置

个人项目地址: SubTopH前端开发个人站

 

(自己开发的前端功能和UI组件,一些有趣的小功能,感兴趣的伙伴可以访问,欢迎提出更好的想法,私信沟通,网站属于静态页面)

SubTopH前端开发个人站https://subtop.gitee.io/subtoph.github.io/#/home

以上 👆 是个人前端项目,欢迎提出您的建议😊

以下是正文内容...............

点击右上角...配置发送给朋友和分享到朋友圈功能

..

1. 全局配置

创建share.js文件

export default {data() {return {// 默认的全局分享内容share: {title: '函证管理系统',path: '/pages/login/Login',    // 全局分享的路径,比如 首页imageUrl: '/static/image/1.png',    // 分享时显示的图片}}},// 1.发送给朋友onShareAppMessage(res) {return {title: this.share.title,path: this.share.path,// imageUrl: this.share.imageUrl,}},//2.分享到朋友圈onShareTimeline(res) {return {title: this.share.title,path: this.share.path,// imageUrl: this.share.imageUrl,}},
}

 在项目的 main.js 文件中引入该 share.js 文件并使用 Vue.mixin() 方法将之全局混入:

import { createSSRApp } from "vue";
import App from "./App.vue";
import 'uno.css'
import share from '@/utils/share.js'export function createApp() {const app = createSSRApp(App);app.mixin(share)return {app,};
}

实现效果如下

 2. 页面单独配置分享功能

如果在特定页面需要自定义分享内容,也仍旧可以使用页面的 onShareAppMessage() 和 onShareTimeline() 方法自定义分享的内容,全局的分享会被页面定义的分享内容覆盖。示例如下:

    //setup中写入和onMounted同级onMounted(() => {// 判断是否存在token ,如果请求接口的token不正确需要删除本地tokenisLogin();});// 分享给朋友onShareAppMessage((res) => {return {title: "函证管理系统", //分享的名称path: `/pages/login/Login`,mpId: "wxd52f50194f0dd6a1", //此处配置微信小程序的AppId};});  // 分享给朋友圈onShareTimeline(() => {return {title: "函证管理系统", //自定义标题, 默认值小程序名称(当前小程序名称)path: `/pages/login/Login`, //自定义图片路径,可以是本地文件或者网络图片。支持 PNG 及 JPG,显示图片长宽比是 1:1(默认使用小程序 Logo)};});

页面中配置分享会覆盖全局配置

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/50628.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

threejs贴图系列(一)canvas贴图

threejs不仅支持各种texture的导入生成贴图,还可以利用canvas绘制图片作为贴图。这就用到了CanvasTexture,它接受一个canas对象。只要我们绘制好canvas,就可以作为贴图了。这里我们利用一张图片来实现这个效果。 基础代码: impo…

开始MySQL探索——数据库概述

计算机语言 计算机语言概述 计算机语言(Computer Language)可以简单的理解为一种计算机和人都能识别的语言。 机器语言 汇编语言 高级语言 机器语言 汇编语言 高级语言 SQL语言基础 SQL的概述 SQL全称:Structured Query Language&…

无涯教程-PHP - preg_match()函数

preg_match() - 语法 int preg_match (string pattern, string string [, array pattern_array], [, int $flags [, int $offset]]]); preg_match()函数在字符串中搜索pattern,如果存在pattern,则返回true,否则返回false。 如果提供了可选…

Ansible 临时命令搭建安装仓库

创建一个名为/ansible/yum.sh 的 shell 脚本,该脚本将使用 Ansible 临时命令在各个受管节点上安装 yum 存储库. 存储库1: 存储库的名称为 EX294_BASE 描述为 EX294 base software 基础 URL 为 http://content/rhel8.0/x86_64/dvd/BaseOS GPG 签名检查为…

11_Redis经典五大类型源码及底层实现

Redis经典五大类型源码及底层实现 一、Redis数据类型的底层数据结构 SDS动态字符串双向链表压缩列表 zpilist哈希表 hashtable调表 skiplist整数集合 intset快速列表 quicklist紧凑列表 listpack 二、Redis源码地址 Github:https://github.com/redis/redis 三、…

java 项目运行时,后端控制台出现空指针异常---java.lang.NullPointerException

项目场景: 提示:这里简述项目背景: 场景如下: java 项目运行时,后端控制台出现如下图所示报错信息:— 问题描述 提示:这里描述项目中遇到的问题: java 项目运行时,后…

Elasticsearch 常见的简单查询

查看es中有哪些索引 请求方式:GET 请求地址:http://localhost:9200 /_cat/indices?v 参数:无 结果: 查看索引全部数据 请求方式:GET 请求地址:http://localhost:9200/index-2023-08/_search 参数&a…

mongodb 数据库管理(数据库、集合、文档)

目录 一、数据库操作 1、创建数据库 2、删除数据库 二、集合操作 1、创建集合 2、删除集合 三、文档操作 1、创建文档 2、 插入文档 3、查看文档 4、更新文档 1)update() 方法 2)replace() 方法 一、数据库操作 1、创建数据库 创建数据库…

使用R语言绘制折线图

写在前面 昨天我们分享了使用Python绘制折线图的教程,跟着NC学作图 | 使用python绘制折线图,考虑到很多同学基本不使用Python绘图。那么,我们也使用R语言复现此图形。 此外,在前期的教程中,我们基本没有分享过折线图的教程。因此,我们在这里也制作一期关于折线图的教程。…

使用VisualStudio制作上位机(二)

文章目录 使用VisualStudio制作上位机(二)第三部分:GUI内部函数设计使用VisualStudio制作上位机(二) Author:YAL 第三部分:GUI内部函数设计 事件添加 给窗体或窗体按钮相关的操作添加事件有两种方式,事件的名字直白的表面了这是什么事件。 直接双击界面,自动生成窗…

跨境电商系统开发:打破国界壁垒,拓展全球市场

拓展全球市场的必然选择 随着国际贸易水平的不断提升和全球市场的日益开放,跨境电商作为一种高效的贸易模式,受到了越来越多电商企业的关注和青睐。跨境电商不仅可以打破国界壁垒和时差限制,还可以在全球市场上实现销售的拓展,带来…

7-42 整型关键字的散列映射

题目链接:这里 题目大意:就是写一个线性探测的散列 然鹅,我不会写(?)我一共错了两个地方 有冲突的情况下,就是线性探查然后往后找,但是我之前写的是t,应该是t (t1)%p;…在有重复关键字的时候&#xff0c…

新功能:部署远程办公支持第三方授权登录

随着业务的发展和信息管理的完善,企业的应用系统也逐渐增多,每个软件系统使用各自的软件数据,独立的用户管理模式,不仅会增加部署成本,对于企业应用平台化管理也是不小的挑战。 对于企业而言,如何实现应用系…

Xamarin.Android实现手写板的功能

目录 1、背景说明2、实现效果3、代码实现3.1 整体思路3.2 核心绘画类-PaintView.cs3.3 对话框类-WritePadDialog.cs3.4 前端实现类-MainActivity3.5 布局文件3.5.1 write_pad.xml3.5.2 activity_main布局文件 4、知识总结5、代码下载6、参考资料 1、背景说明 在实际使用过程中…

【SpringCloud技术专题】「Gateway网关系列」(2)微服务网关服务的Gateway功能配置指南分析

Spring Cloud Gateway简介 Spring Cloud Gateway是Spring Cloud体系的第二代网关组件,基于Spring 5.0的新特性WebFlux进行开发,底层网络通信框架使用的是Netty,所以其吞吐量高、性能强劲,未来将会取代第一代的网关组件Zuul。Spri…

【论文阅读】自动驾驶安全的研究现状与挑战

文章目录 摘要1.引言1.1.自动驾驶安全1.2.攻击面1.3.内容和路线图 2.自动驾驶技术2.1.组成2.2.技术 3.传感器安全3.1.照相机3.2.GNSS(全球导航系统)/IMU(惯性测量单元)3.3.超声波传感器3.4.毫米波雷达3.5.激光雷达3.6.多传感器交叉…

【校招VIP】前端基础之post和get

考点介绍: get和post 是网络基础,也是每个前端同学绕不过去的小问题,但是在校招面试中很多同学在基础回答中不到位,或者倒在引申问题里,就丢分了。 『前端基础之post和get』相关题目及解析内容可点击文章末尾链接查看…

Azure Bastion的简单使用

什么是Azure Bastion Azure Bastion 是一个提供安全远程连接到 Azure 虚拟机(VM)的服务。传统上,访问 VM 需要使用公共 IP 或者设立 VPN 连接,这可能存在一些安全风险。Azure Bastion 提供了一种更安全的方式,它是一个…

JZ36 二叉搜索树与双向链表

问题描述: 输入一棵二叉搜索树,将该二叉搜索树转换成一个排序的双向链表。 问题要求: 1.要求不能创建任何新的结点,只能调整树中结点指针的指向。当转化完成以后,树中节点的左指 针需要指向前驱,树中节点…

selenium +Jmeter 的性能测试

通过Jmeter快速将已有的Selenium 代码以性能测试的方式组织起来,并使用JMeter 丰富的报表展示测试结果 from selenium import webdriver from selenium.webdriver.common.action_chains import ActionChains from selenium.webdriver.common.by import By driver …