//wxml
<view class='nav-right' bindtap='tobackShop'>
<button open-type="share" class='nav-right' style='background:#fff'>
<view>
<image src='../../imgs/index/tab_3.png'></image>
</view>
<text>分享</text>
</button>
</view>

//css
.nav-left,.nav-right{
text-align: center;
}
.nav-left,.nav-right{
text-align: center;
}
.nav-left>view,.nav-right>view{
width: 45rpx;
height: 45rpx;
margin: 0 auto;
margin-top: 15rpx;
}
.nav-left>view image, .nav-right>view image{
width: 100%;
height: 100%;
vertical-align: top;
}
.nav-left text,.nav-right text{
display: block;
margin-top: -30rpx;
font-size: 20rpx;
}
.nav-right button image{
width: 100%;
height: 100%;
vertical-align: top;
}
.nav-right button text{
display: block;
margin-top: -4rpx;
font-size: 20rpx;
}
.nav-right button::after {
border: 0;
">transparent;
}
//js
/**
* 用户点击右上角分享
*/
onShareAppMessage: function (res) {
if (res.from === 'button') {
// 来自页面内转发按钮
// console.log(res.target)
}
return {
// title: '',
path: '/page/detail/detail.js',
success: function (res) {
// 转发成功
},
fail: function (res) {
// 转发失败
}
}
}

转载于:https://www.cnblogs.com/dianzan/p/7842825.html

微信 小程序组件 分享按钮相关推荐

  1. mpvue开发微信小程序，分享按钮报错：`Cannot read property 'apply' of null`

    用mpvue开发微信小程序,分享按钮报错:Cannot read property 'apply' of null thirdScriptError Cannot read property 'app ...

  2. 微信小程序自定义分享按钮

    1.声明 onShareAppMessage 函数   onShareAppMessage() { return { title: '弹出分享时显示的分享标题' desc: '分享页面的内容', pa ...

  3. uniapp微信小程序自定义分享按钮

    1.在 manifest.json 的 App SDK 配置里,勾选微信消息及朋友圈并填写相关微信 appkey. 2. 代码里面调用: <button class="w100 h10 ...

  4. 微信小程序隐藏分享按钮

    引入微信js <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1 ...

  5. 微信小程序点击按钮分享指定页面

    微信小程序点击按钮分享指定页面 1.在wxml里写所要点击的按钮 <button data-info='{{order}}' open-type="share" hover- ...

  6. 微信小程序点击按钮弹出弹窗_微信小程序实现的点击按钮 弹出底部上拉菜单功能示例...

    本文实例讲述了微信小程序实现的点击按钮 弹出底部上拉菜单功能.分享给大家供大家参考,具体如下: index.wxml 弹出action sheet {{item.txt}} 取消 提示:您选择了菜单{ ...

  7. plsql developer无监听程序_微信小程序支持分享到朋友圈啦！技术解读跟我来

    千呼万唤始出来!微信小程序页面分享到朋友圈的功能,终于在安卓系统灰度测试了!目前只在安卓系统!只在安卓系统!只在安卓系统!iOS系统还没有办法体验. 首先,我们看一下官方文档的描述,解读一下小程序分享 ...

  8. 微信小程序之分享功能

    一.介绍 微信小程序的分享功能可以分享页面给朋友或群聊,但是不能分享到朋友圈,需要分享朋友圈的话,可以在小程序内设计一个分享页面,利用小程序提供的canvas把小程序码绘制到分享图里保存到本地分享到朋 ...

  9. android分享朋友圈功能,微信小程序实现分享至朋友圈的功能来啦

    微信小程序「分享至朋友圈」能力,终于来了!(之前,我相信大部分微信小程序的开发者都是用"分享卡片"的形式,手动调用wx.createCanvasContext生成一张图片,让用户生 ...

最新文章

  1. python登录程序编写-初学Python3 - 写一个登录程序
  2. 一个老程序员的心里话（转载）
  3. 鸟哥的Linux私房菜(服务器)- 第十二章、网络参数控管者： DHCP 服务器
  4. mysql innodb 并发 插入 慢_InnoDB并发插入，居然使用意向锁？
  5. 高仿阴阳师官网轮播图效果的jQuery插件
  6. bat管理mstsc 远程桌面连接
  7. Python和js之间的转换
  8. STM32CubeMX使用(五)之IIC及数字加速度计LIS2DW12使用
  9. python如何将数据生成excel_Python如何将数据导出excel的技巧分享
  10. HTML5期末大作业：家乡网站设计——石家庄(10页) HTML+CSS+JavaScrip 旅游网页html 家乡介绍html网页设计 dw旅游景点网页设计 web课程设计网页规划与设计
  11. Office 2016 每次打开都有配置进度 解决办法
  12. 怎样解题 --解题表（how to solve it）
  13. 小程序 WeUI导入时导入失败，出现Component is not found in path 的错误
  14. 最适合家用的洗地机哪个牌子好？家用洗地机品牌排行榜
  15. ajax前端分页实现
  16. 自走棋java代码,【自走棋】地图格子高亮效果
  17. 电子计算机快速算法,序列产生的快速算法
  18. 链游面临重大变局，AZTEC能否异军突起？
  19. java g1的并行_「g1」JVM G1详解 - seo实验室
  20. 条形码的打印，pdf打印条形码

热门文章

  1. 信息学奥赛一本通（C++）在线评测系统——基础（三）数据结构—— 1338：【例3-3】医院设置
  2. 【STM32】GPIO功能复用
  3. 【Java】Java枚举类型示例
  4. 如何中断JAVA线程
  5. joomla添加html,html – 向joomla的前端组件视图添加表单
  6. js reduce实现中间件_实现redux中间件-洋葱模型
  7. 宠物商店(pet-shop) 学习笔记
  8. linux 下升级apache,CentOS6.5在已有低版本环境下安装升级Apache+MySQL+PHP，centos6.5apache...
  9. java线程中的常用方法_[多线程] 线程中的常用方法-最详细
  10. 1010 一元多项式求导 (25 分)(c语言)