微信小程序函数传参以及获取调用

最近在做微信小程序，发现小程序的页面函数传参和web端不一样，在此做个记录；

1.web端函数传参是这样的

<Buttontype="primary"className="mr10"onClick={() => this.loadData({ page: 1 })} // 参数在函数括号内>查询</Button>

2.微信小程序端，是需要类似自定义属性的，传参形式，像下面这样：这里我用了vant的ui框框；原生点击事件方法bindtap="getDetail"

<van-button type="primary" size="small" round custom-class="doBtn" data-orderid="{{item.id}}" // 函数参数需要自定义参数bind:click="getDetail">查看详情
</van-button>// js文件中参数获取（dataset中）getDetail: function (e) {let id = e.currentTarget.dataset.orderid; // 获取参数idconsole.log(id);// 跳转详情页wx.navigateTo({url: `../outDetail/detail?id=${id}`});}

3.小程序详情页面获取url地址传来的ID参数

// 详情页detail.js页面加载时
onLoad: function (options) {console.log(options); // options里面是上级页面传来的参数 {id: 3}let id = options.id;this.setData({orderId: id});},

微信小程序函数传参以及获取调用相关推荐

微信小程序事件传参
微信小程序事件传参 wxml部分 js 部分 wxml部分 1.先绑定事件 2.在该元素上写上属性 data-index 3.参数值即为要传参数 <text catchtap="de ...
微信小程序Url传参
微信小程序的跳转分五种 1.wx.navigateTo:保留当前页面,跳转到应用内的某个页面.但是不能跳到 tabbar 页面,小程序中页面栈最多十层.(可带参) 2.wx.redirectTo:关闭 ...
微信小程序路径传参汉字乱码问题
问题描述操作步骤 1.微信小程序页面跳转的时候进行路由传参,value含有汉字.并且跳转进入的页面中使用到了这个value2.点击右上角胶囊分享3.从分享的链接中点击进入页面,在传入value汉字使 ...
微信小程序事件传参以及循环
微信的循环和传参 wx:for="{{ imageText }}" 循环体 wx:for-item="item" 指定微信的每一项 wx:for-index=& ...
微信小程序页面传参（url）参数过长报错解决办法
在开发中,如果希望将一个对象从一个页面传到另一个页面时,大家可能都会知道用JSON.stringify()的方式,把对象转成JSON字符串再传值,但是当我们的这个对象字符串数值过长的时候就会出现报错, ...
支付宝小程序组件传参,父组件调用子组件方法ref
组件传参子组件中 //js中声明 Component({props: {title: "标题", // 支付宝小程序props变量传参不能传对象,设置类型,只能传字符串onCon ...
微信小程序--页面传参
场景: A页面字段---传递到-->B页面 A页面wxml: wx:for----习惯用<block> 设置所点击的值----data-xxx 获取所点击的值---e.current ...
微信小程序bindtap传参
uni-app uni-file-picker文件上传实现拍摄从相册选择获取图片上传文档服务器（H5上传-微信小程序上传）
前言最近在使用uni-app写H5移动端,有一个从手机拍摄从相册选择获取图片上传到文档服务器功能. 查阅uni-app发现关于上传图片,uni-file-picker文件上传,uni.chooseI ...

微信小程序函数传参以及获取调用

微信小程序函数传参以及获取调用相关推荐

最新文章

热门文章