对于小程序来说,如果有vue或者react这些框架基础的话,学起来很容易上手. 但是要重点说一说的是小程序中的传参方式, 这篇博客主要从以下两个方面来说说传参
1.页面给方法传参
比如现在想通过页面给方法传一个id值, .wxml文件中代码如下:
<view bindtap='getData' data-id='1'></view>
.js文件中代码如下:
getData(e){
let id = e.currentTarget.dataset.id
}
在事件处理对象中,有一个currentTarget的属性,也就是当前的目标对象,通过它就可以获取到我们从页面中传的值. 页面在传值的时候使用的是data-... 要注意的是, 如果传的是data-user-name 那么我们在方法中获取的时候拿到的是userName,它会自动转换为驼峰命名法.
2.页面给页面传参
比如现在要从A页面跳转到B页面中,那么A页面的跳转代码如下:
navigateTo({
url:'跳转页面的路径?id='+this.data.id
})
在路径后,拼接参数,如果有多个参数,那么使用&符号进行连接,要注意,此处传的参数会被强制转换成字符串,所以如果我们想要传一个对象,那么我们可以在传送前,对这个对象进行序列化,使用JSON.stringfy(),把对象转换成json字符串
B页面在页面加载的时候,也就是触发onLoad生命周期的时候,获取A页面传的值,代码如下:
onLoad(option){
option是一个对象,里面存储的就是上个页面传过来的参数
}
如果A页面传的是对象,那么需要使用JSON.parse(),进行反序列化
以上就是传参的内容,欢迎补充指正!