微信小程序分享功能的实现方法有两种

这篇具有很好参考价值的文章主要介绍了微信小程序分享功能的实现方法有两种。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

官方设定5:4 小程序分享尺寸太大,尺寸500px400px(宽高)

在page.js中实现onShareAppMessage,便可在小程序右上角选择分享该页面

onShareAppMessage: function () {
 return {
  title: '弹出分享时显示的分享标题',
  desc: '分享页面的内容',
  path: '/page/user?id=123' // 路径,传递参数到指定页面。
 }
}

自定义按钮实现分享,在page中添加一个带有open-type='share’的button标签()。点击该按钮后,即会自动触发已经在page.js中定义好的onShareAppMessage方法,实现分享功能。

<button open-type='share'>分享</button>

获取分享传递的参数
path属性指向的是user页面,并附带id=123的参数。我们只需在user.js的onLoad函数中,通过options查看传递过来的参数:文章来源地址https://www.toymoban.com/news/detail-505208.html

// user.js
Page({
 onLoad: function(options) {
  console.log(options);
 }
})

到了这里,关于微信小程序分享功能的实现方法有两种的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • uniapp实现微信小程序全局可分享功能

    uniapp实现微信小程序全局【发送给朋友】、【分享到朋友圈】、【复制链接】 主要使用 Vue.js 的 全局混入 1.创建一个全局分享的js文件。示例文件路径为:./utils/shareWx.js ,在该文件中定义全局分享的内容: 2.在项目的 main.js 文件中引入该 shareWx.js 文件, 并使用 Vue.mixin() 方法将

    2024年02月09日
    浏览(59)
  • 使用taro+canvas实现微信小程序的图片分享功能

    二轮充电业务中,用户充电完成后在订单详情页展示订单相关信息,用户点击分享按钮唤起微信小程序分享菜单,将生成的图片海报分享给微信好友或者下载到本地,好友可通过扫描海报中的二维码加群领取优惠。 使用场景及功能:微信小程序 生成海报图片 分享好友 下载图

    2024年02月05日
    浏览(141)
  • uniapp微信小程序全局实现发送给朋友、分享到朋友圈功能(不需要每个页面都配置)

    使用uniapp开发小程序的过程中需要实现: 点击右上角,展开,发送给朋友、分享到朋友圈功能 我们先看没有配置时微信的分享和转发按钮的状态: 配置完成后分享和转发按钮的状态: 接下来分享全局实现的步骤(不需要在每个页面单独配置): 在utils文件夹下新建share.js文

    2024年04月14日
    浏览(78)
  • 微信小程序 分享的两种方式:菜单级和按钮级

    在使用微信小程序的时候,我们可能会设计到一些视频的一些分享等,那么视频分享也分为两种方式,例如下图,当我们点击的时候,进行一个转发分享的一个操作 那么在原先代码的基础上,我们需要在原先代码的基础上button按钮上设置open-type=“share” 添加完open-type=\\\"share\\\"后

    2024年02月20日
    浏览(40)
  • vue3引入JS-SDK实现h5分享小卡片、跳转微信小程序功能

    微信js-sdk官方文档: https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html 想要实现的效果: 1.登录微信公众平台,进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。 2.通过npm引入js-sdk 安装成功后,可以在package.json中找到\\\"weixin-js-sdk\\\" 3.在main.js中,将js-sdk挂载

    2024年02月11日
    浏览(68)
  • uniapp 微信小程序 实现 将base64图片保存相册和转发分享微信好友功能记录 直接cv就能用!!!!

    一、base64图片保存相册功能 提示api:that.$refs.uToast.show用的是uview2.0的toast,可以根据具体引入的ui库去更换; 二、转发分享base64图片给微信好友功能  该功能在微信开发者工具中调试的时候会一直报错,真机是没问题的,可能是编译器的bug。 其实整个wx.showShareImageMenu会拉起保

    2024年02月11日
    浏览(74)
  • uniapp 微信小程序分享、分享朋友圈功能

    页内自定义分享按钮 当页面js上没有添加事件“onShareAppMessage”,右上角‘…’不会出现“转发”事件。 如果有事件,但是没有定义事件内容的话,转发的卡片则是当前页面的截屏信息。 官方文档:https://uniapp.dcloud.io/api/plugins/share?id=onshareappmessage 方式1:小程序右上角原生菜

    2024年02月16日
    浏览(64)
  • 微信小程序的转发分享功能

    微信小程序的转发分享功能,有两种实现方式: button组件 open-type=\\\"share\\\" ,点击按钮后,会触发 Page.onShareAppMessage 事件。 页面右上角菜单“转发”按钮,点击按钮后,也会触发 Page.onShareAppMessage 事件。 代码涉及的文件有: app.json pages/about/about.wxml pages/about/about.wxss pages/about/

    2024年02月09日
    浏览(36)
  • 【微信小程序】使用 wx.scanCode方法实现扫描二维码的功能

    在微信小程序中,你可以使用 wx.scanCode 方法实现扫描二维码的功能。以下是一个简单的示例代码: 在上述代码中,我们使用 wx.scanCode 方法来调用扫描二维码的功能。当扫描成功时, success 回调函数将会被调用,而当扫描失败时, fail 回调函数将会被调用。通过 res.result 可以

    2024年02月15日
    浏览(54)
  • uniapp微信小程序使用分享功能

    实现效果为如下所示的小程序分享功能: 本项目是一个使用uniapp搭建的微信小程序,上线后点击右上角的…,发现其中的发送给朋友和分享到朋友圈是如下图所示的灰色不能点击: 那么,如何设置微信小程序的分享功能呢? 第一步:在onLoad方法中写wx.showShareMenu方法,设置

    2024年02月11日
    浏览(51)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包