微信小程序点击icon实现分享功能

news/2024/7/20 4:13:00 标签: 微信小程序, 小程序, 微信

1.小程序分享功能实现方式
小程序分享功能有两种方式,监听用户点击页面内转发按钮( 组件 open-type=“share”)或右上角菜单“转发”按钮的行为,并自定义转发内容。
使用微信小程序>微信小程序的分享功能需要定义onShareAppMessage(Object object)函数,存在该函数分享功能才能被触发
官网介绍如下:

2.定义触发分享功能的icon按钮
注意设置open-type="share"用于触发分享功能

<button class="iconfont icon-yaoqing" style="font-size:65rpx;width:100%" open-type="share"></button>
1
效果查看
在这里插入图片描述

可以看到icon显示在按钮上了,但存在自带样式,有点丑,需要去掉
我的按钮存在于student-orther-icon下,将该class下的按钮样式清除 

/* button自带样式清除 */
.student-orther-icon button::after {
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.student-orther-icon button {
  background-color: transparent !important;
  padding: 0 !important;
  line-height: inherit !important;
  margin: 0 !important;
  width: auto !important;
  font-weight: 500 !important;
  border-radius: none !important;
}
 

  //分享功能
  onShareAppMessage(res){
    //判断触发的方式是否为按钮
    if(res.from=="button"){
      //参数
      let uid = "111";
      return{
        title:"标题",
        path:"/pages/dynamic/dynamic?uid="+uid
      }
    }
  }
 

在这里插入图片描述

就这样,分享功能就简简单单的实现了 


http://www.niftyadmin.cn/n/355442.html

相关文章

Qt--事件分发器

写在前面 在 Qt 中&#xff0c;事件分发器(Event Dispatcher)是一个核心概念&#xff0c;用于处理 GUI 应用程序中的事件。事件分发器负责将事件从一个对象传递到另一个对象&#xff0c;直到事件被处理或被取消。 每个继承自QObject或QObject的类都可以在本类中重写bool even…

姜春宇:数据治理五大发展趋势

4月27日在2023数据治理新实践峰会上&#xff0c;大数据技术标准推进委员会副主席姜春宇先生以《数据治理发展趋势》为主题为大家分享了数据的价值和最新发展趋势。 以下为姜春宇先生的演讲实录&#xff0c;为了方便阅读&#xff0c;小编做了一些字句修改和文本优化。 大家上午…

数据链路层:Ethernet以太网协议

首先Ethernet、IEEE802.3、PPP和HDLC都是数据链路层的协议&#xff0c;只不过后面三个不常用而已。Ethernet和IEEE802.3属于以太链路层协议&#xff0c;数据链路层最常用的协议是Etnernet以太网协议。 定义&#xff1a; Ethernet以太网协议&#xff0c;用于实现链路层的数据传…

满分Spring全家桶笔记:Spring+Spring Boot+Spring Cloud+Spring MVC

最近小编整理了一下一线架构师的Spring全家桶笔记&#xff1a;SpringSpring BootSpring CloudSpring MVC&#xff0c;分享给大家一起学习一下~ 01 Spring Spring是一个轻量级控制反转(IoC)和面向切面(AOP)的容器框架。Spring框架是由于软件开发的复杂性而创建的。Spring使用的…

【网络编程】详解UDP/TCP套接字的创建流程+守护进程

目录 一、网络编程套接字 1、一些概念 1.1源IP地址和目的IP地址 1.2端口号port 1.3TCP和UDP的性质 1.4网络字节序、IP地址类型转换、数据接收与发送函数、popen函数 2、UDP套接字 2.1UDP服务器创建流程 2.2UDP客户端创建流程 2.3创建socket套接字 2.4绑定套接字对应…

数据治理项目易失败?企业数据治理的解决思路在这里

据Gartner 的一项调查显示&#xff0c;我国超过90%的数据治理项目都失败了。大家的感受也是如此&#xff1a;数据治理的项目不好落地&#xff0c;数据治理项目实施起来从理论到实践有一条巨大的鸿沟很难跨越。 失败的原因各种各样&#xff0c;总结起来大概有4类&#xff1a; …

vue2+wangeditor富文本域

vue2wangeditor富文本域 效果图安装依赖初始化简约模式自定义模式图片设置只允许 base64 方式支持图片服务器 更多配置项目依赖项目代码 效果图 安装依赖 npm i wangeditor/editor wangeditor/editor-for-vue初始化 <template><div class"editor-box">…

1134 Vertex Cover(34行代码+详细注释)

分数 25 全屏浏览题目 切换布局 作者 CHEN, Yue 单位 浙江大学 A vertex cover of a graph is a set of vertices such that each edge of the graph is incident to at least one vertex of the set. Now given a graph with several vertex sets, you are supposed to t…