跳转和传参
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>
