uniapp页面传参

页面传参方法一

index页

 1 <template>
 2     <view class="content">
 3         <!-- url 后面加地址 -->
 4         <navigator url="../hello/hello" >
 5             <button type="primary" style="font-size: 40upx;">跳转到Hello页面（不是导航的页面）</button>
 6         </navigator>
 7         
 8         <!-- 我们需要配置open-type="switchTab", 因为是底部导航栏， 跳转需要额外配置 -->
 9         <navigator url="../guanyu/guanyu" open-type="switchTab" >
10             <button type="primary">跳转到关于页面（底部导航）</button>
11         </navigator>
12         
13         <!-- 配置: hover-class="navigator-hover"  跳转到新窗口 -->
14         <navigator url="../test/test"  hover-class="navigator-hover">
15             <button type="primary">跳转到test(新窗口)</button>
16         </navigator>
17         
18         <view class="" >
19             <button type="default" @click="skip">跳转到新页面</button>
20         </view>
21         
22         <!-- ? 后面加要传的参数， 多个参数用 & 隔开 -->
23         <navigator url="../test/test?name=test1&age=19"  hover-class="navigator-hover">
24             <button type="default">跳转传值 navigator方式</button>
25         </navigator>
26         
27         <view class="" >
28             <button type="default" url="../test/test?name=test&age=18" @click="skip1()">跳转传值 @click方式</button>
29         </view>
30         
31         
32     </view>
33 </template>
34 
35 <script>
36     export default {
37         data() {
38             return {
39                 title: 'Hello'
40             }
41         },
42         methods: {
43             skip(){
44                 // API 形式的跳转
45                 // <!-- uni.navigateTo(OBJECT):  保留当前的页面， 跳转到另一个页面， 返回的话原来的页面还会被保存-->
46                 // <!-- uni.rediretTO(OBJECT):  关闭当前页面， 跳转到另一个页面 -->
47                 uni.navigateTo({
48                     //里面是一个对象形式的参数
49                     url: '../test/test'
50                 })
51             },
52             skip1(){
53                 uni.navigateTo({
54                     // ? 后面加要传的参数， 多个参数用 & 隔开 
55                     url: '../test/test?name=test&age=18'
56                 })
57             }
58         }
59     }
60 </script>
61 
62 <style>
63     .content {
64         text-align: center;
65         height: 400upx;
66     }
67 
68     .logo {
69         height: 200upx;
70         width: 200upx;
71         margin-top: 200upx;
72     }
73 
74     .title {
75         font-size: 36upx;
76         color: #8f8f94;
77     }
78 </style>

text页

<template>
 2     <view>
 3         test
 4     </view>
 5 </template>
 6 
 7 <script>
 8     export default {
 9         data() {
10             return {
11                 
12             }
13         },
14         methods: {
15             
16         },
17         onLoad(options) {
18             //options可以接到index 传过来的值
19             console.log(options)
20         },
21         // 当前页面显示3秒后， 返回上一级页面
22         onShow() {
23             setTimeout(function(){
24                 uni.navigateBack({
25                     delta: 1
26                 })
27             }, 3000);
28         }
29     }
30 </script>
31 
32 <style>
33  
34 </style>

页面传参方法二

//现页面
 uni.navigateTo({
                    url:'./nav?index='+navData
                })
//目的页面接收
//这里onload如果无效，用onshow()也可以
        onLoad(options) {
            var data = JSON.parse(options.index); // 字符串转对象
            console.log(data)
        }

页面传参方法三

传-----    data = JSON.stringify(data)
           wx.navigateTo({
                 url: '/pages/subscribe/subscribe?data=' + data,
           })

收-----   onLoad: function(data) {
                  data = data.data.replace(/""/g, "");
                  data=JSON.parse(data)
                  console.log(data)
           },