uniapp页面跳转传参
时间: 2023-06-10 19:06:09 浏览: 163
在uniapp中,可以使用uni.navigateTo和uni.redirectTo方法进行页面跳转,并且可以通过options参数传递参数。
例如:
在页面A中跳转到页面B,并传递参数:
```
uni.navigateTo({
url: '/pages/b/b?id=123&name=uniapp',
success: function (res) {
console.log('跳转成功')
}
})
```
在页面B中可以通过以下方式获取参数:
```
onLoad: function (options) {
console.log(options.id) //输出:123
console.log(options.name) //输出:uniapp
}
```
注意:如果是通过uni.redirectTo进行页面跳转,则无法通过返回按钮返回上一页,需要通过uni.navigateBack方法返回上一页。
相关问题
uniapp 页面跳转传参
在uni-app中,可以通过多种方法进行页面跳转和传递参数。其中一种方法是通过URL的查询参数来传递参数。在目标页面中,可以使用this.$route.query来获取传递的参数。[1]
另外,还可以根据具体需求选择合适的方法来实现页面之间的跳转和参数传递。比如可以使用uni.navigateTo或uni.redirectTo方法进行页面跳转,并在目标页面中使用this.$route.params获取传递的参数。还可以使用uni.navigateBack返回上一个页面,并在backPage()函数中传递参数。
需要根据实际需要选择适合的方式来进行页面跳转和参数传递。这些方法都有各自的使用场景,可以根据具体情况来选择合适的方法。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* *2* *3* [Uni-app如何进行页面跳转和传递参数?](https://blog.csdn.net/2301_76529312/article/details/131450073)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 100%"]
[ .reference_list ]
uniapp页面跳转传参对象
在uniapp中,可以使用以下方式进行页面跳转传参对象:
1. 使用query参数传递对象
在跳转链接后面加上query参数,将对象转换为JSON字符串,例如:
```
uni.navigateTo({
url: '/pages/myPage/myPage?param=' + JSON.stringify(param)
})
```
在接收页面使用`decodeURIComponent`和`JSON.parse`将字符串转换为对象,例如:
```
onLoad: function(options) {
var param = JSON.parse(decodeURIComponent(options.param));
}
```
2. 使用Vuex进行数据共享
在跳转前将对象存储到Vuex中,跳转后在接收页面从Vuex中获取对象,例如:
```
// 存储对象到Vuex中
this.$store.commit('setParam', param);
// 接收页面从Vuex中获取对象
computed: {
param() {
return this.$store.state.param;
}
}
```
以上两种方式都可以传递对象,具体使用哪种方式需要根据实际情况来定。