微信小程序函数传参

只因太菜

已于 2022-04-12 21:57:06 修改

阅读量706

点赞数

文章标签：微信小程序

于 2022-04-12 16:56:22 首次发布

本文链接：https://blog.csdn.net/lzyzl_/article/details/124128519

版权

这篇博客介绍了微信小程序中.wxml文件的<button>组件使用，展示了如何通过bindtap事件绑定test方法，并在.js文件中接收并打印data-content的值。内容涵盖了小程序的事件处理和数据传递基础概念。

摘要由CSDN通过智能技术生成

.wxml文件
<button bindtap="test" data-content="{{text}}">传参测试</button>



.js文件
const app = getApp()

Page({
  data: {
    text:"这是text"
  },
  onLoad() {
    
  },
  test(e){
    console.log(e.currentTarget.dataset.content)
  }
})

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

只因太菜

关注关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

小程序事件函数传参

m0_69876298的博客

09-07

344

微信小程序传参

微信小程序 页面传参实例详解

09-01

本文将深入讲解微信小程序中页面传参的实例。首先，我们来看一个简单的例子。在这个例子中，我们有两个页面：`index` 和 `navigator`，以及一个带有 `redirect` 属性的页面。在 `index` 页面中，我们使用 `...

参与评论您还未登录，请先登录后发表或查看评论

微信小程序——函数传参方式

热门推荐

朕的博客

03-13

1万+

前言：

微信小程序---函数传参与子组件传递数据并影响父组件函数调用

willwe的博客

10-25

1757

微信小程序无法通过JS函数常见方式在括号内传参： <view bindtap='courseChosen("参数")'></view> 会报错：没有此函数在小程序中可以通过data-num="{{index}}"自定义参数名称传递参数： <view bindtap='courseChosen("参数")' data-num="参数"></view> 在对应的JS文件中写courseChosen函数输出e：我们可以看到此时e...

小程序函数如何传参？

张木期的博客

04-16

6855

今天写小程序，需要传参我以为可以在组件中用形参传递，结果直接报警告，不识别，然后发现只能navgator标签并不方便，点击会成问题，然后查了资料可以自定义属性的方法传参。在小程序开发的时候，有时候需要在点击事件触发之后拿到一个参数做为使用，小程序不像 Vue 可以直接点击事件中放参数，而小程序它只能通过自定义属性进行绑定参数使用。 .wxml 中使用 <view bindtap="touchAction" data-index="1">点击</view> .js 中接收 tou

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

卡卡罗特的博客

09-03

6548

最近在做微信小程序，发现小程序的页面函数传参和web端不一样，在此做个记录； 1.web端函数传参是这样的 <Button type="primary" className="mr10" onClick={() => this.loadData({ page: 1 })} // 参数在函数括号内 > 查询 </Button> 2.微信小程序端，是需要类似自定义属性的，传参形式，像下面这样：这里我用了vant的ui框框；原生点击事件方法

微信小程序 页面跳转传参详解

09-01

总的来说，微信小程序的页面跳转和传参主要依赖`wx.navigateTo` API，通过URL查询参数的方式传递数据。在实际开发中，结合事件处理函数和生命周期方法，可以灵活地实现页面间的交互和数据传递。理解这一机制对于微信...

微信小程序链接传参并跳转新页面

09-01

在微信小程序中，链接传参并跳转新页面是一个常见的操作，这有助于在不同页面间传递数据，实现信息的交互。下面将详细讲解这个过程。首先，我们需要了解微信小程序中的`navigator`组件，它是用于页面跳转的核心...

微信小程序 bindtap 传参的实例代码

10-15

首先，`bindtap` 事件允许我们在 WXML（微信小程序的结构层）中绑定一个函数，当用户点击该组件时，会执行对应的 JavaScript 方法。通常，我们需要在事件处理函数中获取到一些数据，这些数据可以通过 `data-` 属性来...

微信小程序url传参写变量的方法

10-18

总结来说，微信小程序中的URL传参写变量方法是一种简单且高效的数据传递方式。通过合理使用这一机制，开发者可以构建出动态且响应式的用户界面，提升小程序的用户体验和交互能力。不过，开发者在使用时还需要注意...

微信小程序实现传参数的几种方法示例

08-28

主要给大家介绍了关于微信小程序实现传参数的几种方法，分别是navigator跳转时、全局变量、列表index下标取值以及form表单传值的相关内容，需要的朋友可以参考借鉴，下面随着小编来一起学习学习吧。

微信小程序页面之间传参的几种方式

最新发布

01-10

7557

A页面部分js代码B页面部分js代码。

微信小程序 功能函数点击传参和页面

weixin_30251587的博客

11-04

155

// 商品详情页跳转函数 detailInto: function (e) { // console.log() var change = e.currentTarget.dataset.id; wx.navigateTo({ url: '../detail/detail?id=' + change }) }, //接收的页面 onLoad: function (op...

微信小程序：事件传参

KazariFox的博客

08-15

1万+

在微信小程序日常开发中，特定场景下我们需要事件携带参数到要执行的函数中，但是又因为小程序的事件传参方式有所不同，并不能在绑定事件后，在事件名称后面加括号携带参数。页面是简单的数据渲染加一个点击按钮，实现通过点击按钮触发事件并携带参数，操作参数来修改数据，从而达到图片上的效果。小程序绑定事件，默认双引号内的都是事件名称，所以这是我们要想在微信小程序实现事件传参的话，可以使用。可以看到，通过打印整个事件可以看到通过自定义属性。可以看到，代码中定义了点击事件。那么，如何获取事件携带的参数呢？.........

微信小程序开发事件传参

qq_35262929的博客

10-27

448

微信小程序开发，绑定事件

微信小程序传参的五种方式

SqlloveSyn的博客

09-19

6110

大家好，今天和大家分享一下微信小程序页面之间传参的五种方式，这个的话也是有人问了我一嘴，然后现在我和大家分享一下。URL参数传递：可以将参数直接拼接在页面的URL中，在打开目标页面时，通过获取URL的query参数来获取传递的数值。Storage本地存储：可以使用小程序提供的Storage API，将参数存储在本地缓存中，然后在目标页面读取并使用。全局变量：可以在小程序的App全局对象中定义一个全局变量，在页面间进行传递和访问。在源页面设置变量值，在目标页面获取变量值。

uniapp 开发微信小程序 v-bind给子组件传递函数，该函数中的this不是父组件的二是子组件的this

柑橘乌云_

10-31

601

这个方法因为定义了全局变量that 那么该变量就只能用一次，不然会有赋值覆盖的情况。解决办法：子组件通过缓存子组件this然后，用bind改写this。要么就弃用v-bind传入函数,改为emit传入自定义事件。

【第十一节：微信小程序 小程序页面跳转与传参】微信小程序入门，以思维导图的方式展开11

十年以上编程经验的干货分享

11-30

452

onLoad:function(options){\n\n // 页面初始化 options为页面跳转所带来的参数\n\n console.log(options.name);默认跳转过去在导航栏中会出现一个返回按钮，如果不用返回，可以添加属性redirect。要使普通元素点击的时候有高亮的效果，可以给元素添加cursor:pointer的样式。跳转的页面的js页面中的onLoad函数的参数options就是传过来的参数了。url的用法和html中a标签的href一样，用?

微信小程序路由传参取餐

10-18

微信小程序路由传参可以通过以下步骤实现： 1. 在跳转页面的按钮或其他组件上绑定事件，例如： ``` <button bindtap="goToOrderDetail" data-orderid="{{orderId}}">查看订单详情</button> ``` 2. 在对应的页面JS文件中定义事件处理函数，获取传递过来的参数并跳转到目标页面，例如： ``` goToOrderDetail: function(event) { var orderId = event.currentTarget.dataset.orderid; wx.navigateTo({ url: '/pages/orderDetail/orderDetail?orderId=' + orderId }) } ``` 3. 在目标页面的onLoad函数中获取传递过来的参数，例如： ``` onLoad: function(options) { var orderId = options.orderId; // 根据orderId获取订单详情并展示 } ```