uniapp如何使用router-view显示其他页面
时间: 2023-11-22 11:55:27 浏览: 145
uniapp中的一个完全相似Vue-router的路由插件
5星 · 资源好评率100%
在Uniapp中,可以使用`<router-view>`标签来显示其他页面。具体步骤如下:
1. 在`pages.json`中配置要显示的页面,例如:
```
{
"pages": [
{
"path": "pages/home/home",
"style": {}
},
{
"path": "pages/about/about",
"style": {}
}
],
"globalStyle": {
"navigationBarTextStyle": "black",
"navigationBarTitleText": "Uniapp",
"navigationBarBackgroundColor": "#F7F7F7",
"backgroundColor": "#F7F7F7"
}
}
```
2. 在页面中使用`<router-view>`标签来显示其他页面,例如:
```
<template>
<view>
<text>这是首页</text>
<router-view></router-view>
</view>
</template>
```
3. 在需要切换页面的地方使用`uni.navigateTo()`或`uni.redirectTo()`等方法进行页面跳转,例如:
```
uni.navigateTo({
url: '/pages/about/about'
});
```
这样就可以在首页中使用`<router-view>`标签来显示其他页面了。
阅读全文