uniapp小程序分享功能onShareAppMessage函数传参数

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

1、使用onShareAppMessage函数。在页面的js文件中定义了 onShareAppMessage 函数时,页面可以表示该页面可以转发。可以在函数中设置页面转发的信息。
(1)只有定义了该函数,小程序右上角的菜单中才会有转发按钮
(2)用户点击转发按钮的时候回调用该函数
(3)该函数内需要 return 一个 Object,Object中包含转发的信息(可自定义转发的内容)

2、一个是页面中具有属性open-type且其值为share的button。(注:必须是button组件,其他组件中设置 open-type=“share” 无效)

即:<button data-name="shareBtn" open-type="share">转发</button>

注意!!! onShareAppMessage是页面的方法, 组件内不会触发。

小程序中分享功能需要在button组件中添加open-type:“share”,当点击button的时候就会调用onShareAppMessage函数。如果需要将按钮的参数传入给函数,使用       :data-属性=值

html:

<view class="activity-box" v-for="(item,index) in activity" >
					<view class="activity-title flex between center-v">
						<view class="title text-ellipsis">
								{{item.theme}}
						</view>
						<button type="default"  open-type="share" :data-item='item'>
						    <image :src="getStaticIconPath('icon-zhuanfa.png')" mode="" class="_inco"></image>
						</button>
					</view>
</view>
					
js:

//分享函数
		onShareAppMessage(res) {
			console.log(res,'我是分享');  //打印出来的就是:data-item='item'里的'item'值
                                         //也就是循环里的item值,循环里的每一项

            const that = this;
			let data = res.target.dataset.item; //取到传入的参数

            let shareobj = {
				title:'',//分享的标题    默认是小程序的名称
				path:"",//好友点击分享之后跳转的页面   默认是当前页面,必须是以‘/’开头的完整路径
				imageUrl: "",//自定义图片路径,可以是本地文件路径、代码包文件路径或者网络图片路径,支持PNG及JPG,不传入 imageUrl 则使用默认截图。显示图片长宽比是 5:4
			}

            //来自页面按钮内的分享
			if(res.from === 'button'){
				shareobj.title="",   //你要分享的标题
                shareobj.path="",    //你要跳转的页面路径
                shareobj.imageUrl="",//你要分享的图片
			}

			return shareobj//最后一定要返回对象

		},

效果图如下: (console.log(res,'我是分享'))

onshareappmessage怎么传参,uni-app,小程序,前端文章来源地址https://www.toymoban.com/news/detail-516284.html

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

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

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

相关文章

  • 微信小程序的分享配置onShareAppMessage

    在小程序的js页面里,写次方法,则点击右上角三个“···”会有对应的分享菜单,如果不写,其实就相当于禁用的该页面的分享。如果只是一个方法,不进行配置,则分享出来的是默认的样式,下面就来说说如何配置:

    2024年02月12日
    浏览(33)
  • 微信小程序在onShareAppMessage中阻止分享

    首先简单介绍微信小程序的分享方法onShareAppMessage,参考文档Page(Object object) | 微信开放文档 (qq.com) 在这个方法中,可以自定义分享的链接、标题、缩略图。不自定义的话,返回默认值。  相信很多人在开发的时候,都会遇到这种需求,在分享前先对分享内容做校验,通过校验

    2024年02月11日
    浏览(42)
  • uni-app 微信小程序 使用mixins设置分享 onShareAppMessage

    参考链接:https://www.jianshu.com/p/844018ca174f 这样设置后,右上角三个点的分享就可以分享了

    2024年02月12日
    浏览(54)
  • onShareAppMessage 微信小程序

    监听用户点击页面内转发按钮(button 组件 open-type=“share”)或右上角菜单“转发”按钮的行为,并自定义转发内容。 注意:只有定义了此事件处理函数,右上角菜单才会显示“转发”按钮

    2024年02月11日
    浏览(39)
  • 微信小程序 open-type=“share“ onShareAppMessage 不触发

    点击 Button 会唤起分享弹框,但是不会触发定义的 onShareAppMessage 事件,无法定义分享卡片的内容。 分享行为是基于页面维度的。在 page.json 定义的页面中声明的 onShareAppMessage 才是有效的,如果你在组件中声明了 onShareAppMessage 是不会在分享 Button 点击时触发的。实际上,如果你

    2024年02月11日
    浏览(42)
  • uniapp 实现当前页面分享至微信好友或朋友圈功能(带参数和无参数)

    大家好!匆匆忙忙又到了周三,今天是 2023年9月13日|农历七月二十九 ,今天这篇文章主要是微信小程序实现分享当前页面到朋友圈或微信好友,下面来看下具体实现方式吧! 带参数和无参数是根据自己的业务需求,如果需要再onLoad函数里面赋值一些属性值的时候可以在 pat

    2024年02月09日
    浏览(49)
  • uniapp 微信小程序 动态分享 带参数

    uniapp 微信小程序 有动态参数的那种 微信小程序分享有两种分享。 第一种:就是右上角自带的菜单分享 第二种: button按钮通过open-type=\\\"share\\\" 点击分享 通常我们分享默认都是分享本页面 然后带一些分享参数比如说id uid等 直接放在url地址后面就可以了, 那如果我们使用 按钮

    2024年02月11日
    浏览(72)
  • uniapp实现小程序分享功能

    一般情况下是这样来写的,不过感觉太麻烦,每个页面都要写一次 所以这里我进行了封装  封装share.js代码 挂载到main.js 这样就实现了效果图如下!!!

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

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

    2024年02月16日
    浏览(55)

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

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

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

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

二维码1

领取红包

二维码2

领红包