写一个uniapp启动加载页面
时间: 2023-12-02 11:03:12 浏览: 71
可以使用uniapp的官方插件"uni-simple-router"来实现启动加载页面。具体步骤如下:
1. 在项目根目录下的pages文件夹中新建一个名为"loading"的页面,该页面即为启动加载页面。
2. 在"loading"页面中添加一个loading组件或者自定义loading动画。
3. 在"loading"页面的生命周期函数中加入跳转逻辑,例如:
```
onLoad() {
setTimeout(() => {
uni.redirectTo({
url: '/pages/index/index'
});
}, 2000); // 2秒后跳转到首页
}
```
4. 在"uni-simple-router"的配置文件中将"loading"页面设置为默认路由,例如:
```
const router = new Router({
routes: [
{
path: '/',
redirect: '/loading'
},
{
path: '/loading',
name: 'loading',
component: () => import('@/pages/loading/loading.vue')
},
{
path: '/index',
name: 'index',
component: () => import('@/pages/index/index.vue')
}
]
})
```
这样,在启动应用时,会自动跳转到"loading"页面,等待一段时间后再跳转到首页。
相关推荐
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)