微信小程序实现页面分享onShareAppMessage


Posted in Javascript onAugust 12, 2019

效果

微信小程序实现页面分享onShareAppMessage

js

let app = getApp();
Page({
 data: {
  img: "/images/1.jpg"
 },
 onLoad() {
 },
 showShareMenu() {
  wx.showShareMenu();
  console.log("显示了当前页面的转发按钮");
 },
 hideShareMenu() {
  wx.hideShareMenu();
  console.log("隐藏了当前页面的转发按钮");
 },
 onShareAppMessage: (res) => {
  if (res.from === 'button') {
   console.log("来自页面内转发按钮");
   console.log(res.target);
  }
  else {
   console.log("来自右上角转发菜单")
  }
  return {
   title: '妹子图片',
   path: '/pages/share/share?id=123',
   imageUrl: "/images/1.jpg",
   success: (res) => {
    console.log("转发成功", res);
   },
   fail: (res) => {
    console.log("转发失败", res);
   }
  }
 }
})

html

<view class="view">
 <image class="cover-9" src="{{img}}" bindtap="img"></image>
 <view class="window-1">
  <button type="default" id="open" bindtap="showShareMenu">开启分享</button>
  <button type="warn" id="close" bindtap="hideShareMenu">关闭分享</button>
 </view>
 <button type="primary" open-type="share" data-name="pageShare" id="share">点击分享</button>
</view>

css

page{
 height: 100%;
}
.view{
 width: 100%;
 height: 100%;
}
.window-1{
 display: flex;
 flex-direction: row;
 margin: 20rpx 0;
}
.cover-9{
 width: 688rpx;
 height: 75%;
 margin: 0 30rpx;
 border:2rpx solid;
 border-radius:5px; 
}
button{
 margin: 0 10rpx;
 width: 100%;
}
#share{
 width: 730rpx;
}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery Div中加载其他页面的实现代码
Feb 27 Javascript
JQuery扩展插件Validate 2通过参数设置验证规则
Sep 05 Javascript
extjs中form与grid交互数据(record)的方法
Aug 29 Javascript
jQuery.lazyload+masonry改良图片瀑布流代码
Jun 20 Javascript
JavaScript开发人员的10个关键习惯小结
Dec 05 Javascript
完美解决JS文件页面加载时的阻塞问题
Dec 18 Javascript
浅谈VUE单页应用首屏加载速度优化方案
Aug 28 Javascript
vue做移动端适配最佳解决方案(亲测有效)
Sep 04 Javascript
angular6 填坑之sdk的方法
Dec 27 Javascript
JS插入排序简单理解与实现方法分析
Nov 25 Javascript
VUE中使用HTTP库Axios方法详解
Feb 05 Javascript
javascript利用键盘控制小方块的移动
Apr 20 Javascript
react实现antd线上主题动态切换功能
Aug 12 #Javascript
vue从一个页面跳转到另一个页面并携带参数的解决方法
Aug 12 #Javascript
解析原来浏览器原生支持JS Base64编码解码
Aug 12 #Javascript
在vue-cli 3中给stylus、sass样式传入共享的全局变量
Aug 12 #Javascript
微信小程序实现页面跳转传递参数(实体,对象)
Aug 12 #Javascript
微信小程序实现传递多个参数与事件处理
Aug 12 #Javascript
node命令行工具之实现项目工程自动初始化的标准流程
Aug 12 #Javascript
You might like
PHP 七大优势分析
2009/06/23 PHP
php ob_flush,flush在ie中缓冲无效的解决方法
2010/05/09 PHP
PHP数组循环操作详细介绍 附实例代码
2013/02/03 PHP
又十个超级有用的PHP代码片段
2015/09/24 PHP
TP5框架安全机制实例分析
2020/04/05 PHP
让getElementsByName适应IE和firefox的方法
2007/09/24 Javascript
7个Javascript地图脚本整理
2009/10/20 Javascript
js下拉框二级关联菜单效果代码具体实现
2013/08/03 Javascript
extjs 分页使用jsp传递数据示例
2014/07/29 Javascript
JavaScript实现获取dom中class的方法
2015/02/09 Javascript
javascript实现图片上传前台页面
2015/08/18 Javascript
基于jQuery实现以手风琴方式展开和折叠导航菜单
2016/01/28 Javascript
下雪了 javascript实现雪花飞舞
2020/08/02 Javascript
JavaScript实战之菜单特效
2016/08/16 Javascript
bootstrap按钮插件(Button)使用方法解析
2017/01/13 Javascript
Webpack打包css后z-index被重新计算的解决方法
2017/06/18 Javascript
vue实现验证码按钮倒计时功能
2018/04/10 Javascript
Nodejs把接收图片base64格式保存为文件存储到服务器上
2018/09/26 NodeJs
js中数组常用方法总结(推荐)
2019/04/09 Javascript
vue打包通过image-webpack-loader插件对图片压缩优化操作
2020/11/12 Javascript
Python获取运行目录与当前脚本目录的方法
2015/06/01 Python
Python读写unicode文件的方法
2015/07/10 Python
深入浅析Python字符编码
2015/11/12 Python
Python编程中实现迭代器的一些技巧小结
2016/06/21 Python
mysql 之通过配置文件链接数据库
2017/08/12 Python
Python Tkinter实现简易计算器功能
2018/01/30 Python
Python高阶函数、常用内置函数用法实例分析
2019/12/26 Python
如何利用pygame实现简单的五子棋游戏
2019/12/29 Python
Python 如何在字符串中插入变量
2020/08/01 Python
详解使用HTML5的classList属性操作CSS类
2017/10/13 HTML / CSS
高校教师思想汇报
2014/01/11 职场文书
创意广告词
2014/03/17 职场文书
邀请函怎么写
2015/01/30 职场文书
2015政治思想表现评语
2015/03/25 职场文书
小学数学国培研修日志
2015/11/13 职场文书
高中议论文(范文2篇)
2019/08/19 职场文书