uniapp跳转页面传参
时间: 2024-12-25 20:13:57 浏览: 2
uni-app如何页面传参数的几种方法总结
在uniApp中,跳转页面并传递参数通常使用`navigator.push`或`navigator.navigateTo`方法,这两个方法都接受一个对象作为参数,这个对象包含你要传递的数据,称为`options`对象。例如:
```javascript
// 使用push方法
navigator.push({
url: '/pages/newPage/newPage',
data: { key: 'value', param1: 'paramValue' } // 这里data属性用于传参
});
// 或者使用navigateTo方法(异步)
navigator.navigateTo({
url: '/pages/newPage/newPage',
animated: true,
data: {
key: 'value', // 页面接收数据的结构需要和这里一致
}
});
```
目标页面可以接收到这些参数,通过`$route.query`(查询字符串形式)或`$route.params`(路径片段形式)来获取:
```vue
<script>
export default {
onLoad() {
const params = this.$route.params; // 获取路径片段传入的参数
const query = this.$route.query; // 获取查询字符串传入的参数
console.log(params, query);
}
}
</script>
```
阅读全文