vue3+uniapp配置路由导航守卫

2024-02-21  本文已影响0人  李小白呀

使用gowiny-uni-router 配置uniapp路由导航守卫
1.安装

npm install @gowiny/uni-router

2.创建router/index.js文件

import { createRouter } from '@gowiny/uni-router'
import PAGE_DATA from '@/pages.json';

// const token = uni.getStorageSync('token')
const router = createRouter({
    pageData:PAGE_DATA
})
 console.log('token',uni.getStorageSync('token'))
 const whiteList = ['/pages/login/login', '/pages/register/register','/pages/policy/policy','/pages/notify/notify'];
router.beforeEach((to,from)=>{
  // debugger
  console.log(whiteList.indexOf(to.path) !== -1)
  if(whiteList.indexOf(to.path) == -1){
        if(uni.getStorageSync('token') ){
            // next();
            uni.navigateTo({
                url: to.path
            });
        }else{
            setTimeout(()=>{  //拦截后一直跳不过去,加上定时器后就好了
                uni.navigateTo({
                    url: '/pages/login/login'
                });
            },0)
        }
    }else{
        uni.navigateTo({
            url: to.path
        });
        
    }
})
 
export default router

3.main.js里面配置

import { createPinia } from 'pinia'
import { createSSRApp } from "vue";
import uviewPlus from '@/uni_modules/uview-plus'
import router from './router'
import App from "./App.vue";

export function createApp() {
    const app = createSSRApp(App);
    const pinia  = createPinia();
    app.use(pinia)
    app.use(router)
    return {
        app
    };
}
上一篇 下一篇

猜你喜欢

热点阅读