uniapp跳转页面传参数
时间: 2023-08-29 10:10:52 浏览: 82
在uniapp中,可以通过在跳转页面时使用url参数来传递数据。以下是一个简单的例子:
```
//在A页面中跳转到B页面,并传递参数
uni.navigateTo({
url: '/pages/B/B?id=123&name=uniapp'
})
//在B页面中获取传递的参数
export default {
onLoad(options) {
console.log(options.id) //输出123
console.log(options.name) //输出uniapp
}
}
```
在跳转时,可以在url中添加参数,通过?key=value的形式传递。在接收方页面中,可以通过onLoad方法中的options参数获取传递的参数值。
相关问题
uniapp跳转页面携带参数
在 UniApp 中,可以使用 `uni.navigateTo` 或 `uni.redirectTo` 方法实现页面跳转,并携带参数。下面是一个示例:
```javascript
// 在当前页面跳转到目标页面,并携带参数
uni.navigateTo({
url: '/pages/targetPage/targetPage?param1=value1¶m2=value2', // 目标页面的路径,参数使用 '?' 和 '&' 进行连接
success: function(res) {
console.log('跳转成功');
},
fail: function(err) {
console.log(err);
}
});
```
在目标页面中,可以通过 `this.$route.query` 获取传递的参数:
```javascript
// 在目标页面中获取传递的参数
console.log(this.$route.query.param1); // 输出 'value1'
console.log(this.$route.query.param2); // 输出 'value2'
```
如果你想使用 `uni.redirectTo` 方法进行跳转,用法与 `uni.navigateTo` 类似,只是 `redirectTo` 是关闭当前页面后再跳转到目标页面。
希望这个示例对你有帮助!如果你有更多问题,可以继续问我。
uniapp跳转页面传递参数
uniapp跳转页面传递参数有两种方式:
1. 上级页面使用events,利用下级页面向上级页面传递数据的变量名获取传递的参数。
上级页面代码示例:
```javascript
preserveRevise(){
uni.navigateTo({
url:'/pages/addressMange/addressMange?id=1',
events:{
//获取下级页面传递回来的参数
sonPageData:data=>{
console.log(data);
}
}
})
}
```
下级页面代码示例:
```javascript
onLoad(e){
console.log(e.id);
this.getOpenerEventChannel().emit('sonPageData',"我是第二个页面传递回来的数据")
}
```
2. 下级页面利用this.getOpenerEventChannel().emit向上级页面传递参数的变量名和变量值。
上级页面代码示例:
```javascript
preserveRevise(){
uni.navigateTo({
url:'/pages/addressMange/addressMange?id=1',
})
}
```
下级页面代码示例:
```javascript
onLoad(e){
console.log(e.id);
this.getOpenerEventChannel().emit('sonPageData',"我是第二个页面传递回来的数据")
}
```
阅读全文