微信小程序页面跳转携带参数 接收参数的页面怎么接收参数使用
时间: 2023-09-17 20:11:57 浏览: 100
接收参数的页面可以通过以下两种方式来获取传递过来的参数:
1. 在页面的 onLoad 生命周期中获取
在接收参数的页面中,可以在 onLoad 函数中获取传递过来的参数,例如:
```
Page({
onLoad: function (options) {
console.log(options.id) // 输出 123
}
})
```
在这个例子中,我们通过 `options` 参数来获取传递过来的参数,其中 `id` 就是传递过来的参数名。
2. 通过 getCurrentPages() 方法获取
在接收参数的页面中,可以通过 `getCurrentPages()` 方法获取当前页面栈,再通过 `options` 属性获取传递过来的参数,例如:
```
Page({
onLoad: function () {
var pages = getCurrentPages()
var currentPage = pages[pages.length - 1]
console.log(currentPage.options.id) // 输出 123
}
})
```
在这个例子中,我们通过 `getCurrentPages()` 方法获取当前页面栈,再通过 `currentPage.options` 属性来获取传递过来的参数,其中 `id` 就是传递过来的参数名。
相关问题
微信小程序页面跳转携带参数 页面怎么接收参数
微信小程序页面跳转携带参数可以通过在跳转链接中添加参数的方式来实现,例如:
```
wx.navigateTo({
url: '/pages/detail/detail?id=123'
})
```
在接收参数的页面中可以通过 `getCurrentPages()` 方法获取当前页面栈,再通过 `options` 属性获取传递过来的参数,例如:
```
Page({
onLoad: function (options) {
console.log(options.id) // 输出 123
}
})
```
这里的 `options` 参数就是从上一个页面传递过来的参数,可以通过其中的属性名来获取具体的值。
微信小程序中跳转页面传递对象参数
在微信小程序中,可以使用`wx.navigateTo`或`wx.redirectTo`方法跳转页面,并且可以通过传递参数的方式将数据传递到目标页面。具体实现方法如下:
1. 在源页面中,使用`wx.navigateTo`或`wx.redirectTo`方法跳转到目标页面,并将数据以对象的形式传递给目标页面。例如:
```javascript
wx.navigateTo({
url: '/pages/target/target?id=123&name=小明&age=18',
});
```
在上述代码中,我们将数据以查询字符串的形式传递给目标页面,查询字符串的键值对以`&`分隔,键和值之间以`=`连接。
2. 在目标页面的`onLoad`生命周期函数中,获取传递过来的数据。例如:
```javascript
onLoad: function (options) {
console.log(options); // { id: '123', name: '小明', age: '18' }
},
```
在上述代码中,我们可以通过`options`参数获取传递过来的数据,`options`是一个对象,包含了所有传递过来的查询字符串的键值对。
需要注意的是,如果传递的数据是一个对象,可以使用`JSON.stringify`方法将其转换成字符串,然后在目标页面中使用`JSON.parse`方法将其转换回对象。例如:
```javascript
// 在源页面中传递对象参数
const obj = {
id: 123,
name: '小明',
age: 18
};
wx.navigateTo({
url: `/pages/target/target?data=${JSON.stringify(obj)}`,
});
// 在目标页面中获取对象参数
onLoad: function (options) {
const data = JSON.parse(options.data);
console.log(data); // { id: 123, name: '小明', age: 18 }
},
```
在上述代码中,我们将传递的对象参数使用`JSON.stringify`方法转换成字符串,然后将其以查询字符串的形式传递给目标页面。在目标页面中,使用`JSON.parse`方法将其转换回对象。