php 小程序页面传参,介绍小程序中传递参数的实现方法

这篇文章主要介绍了微信小程序参数传递详解的相关资料,需要的朋友可以参考下

微信小程序的推出，无疑将会在移动互联网行业里再次掀起风浪。

有人会质疑小程序会不会火，会不会火我不知道，看微信的用户量即可明白一切。

微信小程序-参数传递

这里我找到两种小程序上的参数传递方式，为了方便，我单独拿出来和大家分享下.

一、通过事件进行参数传递

先来看眼小程序对事件的定义：

#什么是事件?

这里是列表文本事件是视图层到逻辑层的通讯方式。

这里是列表文本事件可以将用户的行为反馈到逻辑层进行处理。

这里是列表文本事件可以绑定在组件上，当达到触发事件，就会执行逻辑层中对应的事件处理函数。

这里是列表文本事件对象可以携带额外信息，如id, dataset, touches。

很明确的指出了是视图层【wxml】到逻辑层【js】的通信方式，时间对象可以携带额外信息，用这个事件来传递参数肯定没错了，接下来我们就来实际看下例子：

视图.wxml

Click me!

逻辑.js

Page({

tapName: function(event) {

console.log(event.target)

}

})

log打印

可以看到 dataset 里面就是我们设置的data-hi="MINA"的值了。现在我们来看下刚刚我们写的，首先 bindtap,以bind开头的就是要给他绑定个事件，这个事件的名字就是“=”号后面的数值就是绑定的事件名称，需要在逻辑【js】层定义上。然后就是传值了，注意到的朋友可以看到我们这里写了data-hi 和我们平时写js的传值是同一个定义方法。这个data-*就对应事件的属性target里的dataset 值。这里我们需要调用的话就是 event.target.dataset.hi就能取到data-hi所对应的值。

这里需要注意下 data的定义名称：书写方式：以data-开头，多个单词由连字符-链接，不能有大写(大写会自动转成小写)如data-element-type，最终在 event.target.dataset 中会将连字符转成驼峰elementType。

官方示例：

DataSet Test

Page({

bindViewTap:function(event){

event.target.dataset.alphaBeta == 1 // - 会转为驼峰写法

event.target.dataset.alphabeta == 2 // 大写会转为小写

}

})

二、navigator 跳转url传参

*.wxml

跳转到新页面

在当前页打开

*.js 跳到新页面之后在onload里面直接接收参数，接收方法也就是 options.[参数值]

Page({

onLoad: function(options) {

this.setData({

title: options.title

})

}

})

好啦，今天就写到这里，我顺便把文档链接写上，上面写的文档里都有。我只是把它们搬出来了，用我的话说了一遍。 …(⊙＿⊙；)…

【相关推荐】

php 小程序页面传参,介绍小程序中传递参数的实现方法相关推荐

微信小程序页面传参（url）参数过长报错解决办法
在开发中,如果希望将一个对象从一个页面传到另一个页面时,大家可能都会知道用JSON.stringify()的方式,把对象转成JSON字符串再传值,但是当我们的这个对象字符串数值过长的时候就会出现报错, ...
微信小程序--页面传参
场景: A页面字段---传递到-->B页面 A页面wxml: wx:for----习惯用<block> 设置所点击的值----data-xxx 获取所点击的值---e.current ...
html点击事件传参 php,HTML通过事件传递参数到js详解及实例
目标处理函数为selectAttr(test) 1.直接传递给定参数如:οnclick="selectAttr('1'); οnclick="selectAttr('a'); 2. ...
vue url传参，获取url中的参数
url参数 //在生命周期中获取,在方法中写法相同 create(){this.$router.currentRoute.query.id //这个不用this.$route.query.id //用 ...
微信小程序使用onfire.js（事件订阅和分发JavaScript 库）实现跨页面传参，对onfire的全面了解
开发微信小程序时,页面间数据传送多采用URL方式传参.添加全局变量,对于在本地缓存不大实用(感觉操作缓存,应该性能会有一定的损耗吧).而从新打开的页面回到之前的界面,貌似只有放在本地缓存.添加全局变量 ...
uni-app tabbar页面传参
官网中说明uni-app和小程序的switchTab跳转tabbar页面,路径后不能带参数,所以,以下使用两种方法进行tabbar页面之间的传参. 全局变量传参(globalData全局变量) 传递参 ...
URL传参时从URL中获取中文参数的方法
利用url传参时如果url中的参数是中文时因为编码类型不同在页面中获取会出现乱码使用此方法能获取url中的参数值并解决乱码问题调用时直接 GetUrlByParamName("参数名& ...
小程序 | 小程序中常用的事件 + 事件对象的属性列表 +小程序事件传参 + 小程序全局配置 + 小程序页面配置 + 小程序发起网络数据请求
文章目录一.WXML 模板语法数据绑定事件绑定 ⭐小程序中常用的事件 ⭐事件对象的属性列表 target 和 currentTarget 的区别 bindtap 的语法格式在事件处理函数中为 ...
支付宝扫码跳转小程序并传参
支付宝扫码跳转小程序并传参 1. 打开支付宝开放平台支付宝开放平台打开支付宝开放平台,进入自己的小程序详情页面.点击小程序码>关联普通二维码>添加按钮 2. 输入业务域名这里我们选择 ...

php 小程序页面传参,介绍小程序中传递参数的实现方法

php 小程序页面传参,介绍小程序中传递参数的实现方法相关推荐

最新文章

热门文章