[小程序技能树]路由跳转_使用navigator组件进行页面跳转

路由跳转

1.uniapp有几种路由跳转的方法？

两种：使用navigator组件跳转、调用API跳转

2.什么是navigator跳转？

组件跳转。即用组件代替功能，内嵌按钮以达到跳转的效果。
举一个简单的示例。

<!-- open-type为navigate，如果不写open-type跳转方式默认为navigate -->
<navigator :url="url" open-type="navigate">
  <button type="default">跳转到新页面</button>
</navigator>
<!-- open-type为redirect -->
<navigator :url="url" open-type="redirect">
  <button type="default">在当前页打开</button>
</navigator>
<!-- open-type为switchTab -->
<navigator :url="url" open-type="switchTab">
  <button type="default">跳转到tab页面</button>
</navigator>
1
2
3
4
5
6
7
8
9
10
11
12

3.open-type的默认值与有效值？
open-type 默认值为navigate、其他有效值如下。

3.什么是调用api跳转？
点击事件绑定方法的形式，以uni. 触发跳转方法，并携带对应的url。

navigateTo(){
  uni.navigateTo({
    url: this.url
  })
},
redirectTo(){
  uni.redirectTo({
  url: this.url
  });
},
switchTab(){
  uni.switchTab({
    url: this.url
  });
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15