SilurianYang / uni-simple-router

A simple, lightweight 'uni-app' routing plugin
https://v2.hhyang.cn/v2/
MIT License
749 stars 163 forks source link

Nvue 项目 beforeEnter 未触发 #381

Closed luck-hao closed 2 years ago

luck-hao commented 2 years ago

问题描述 [问题描述:尽可能简洁清晰地把问题描述清楚]

复现步骤 [复现问题的步骤]

  1. 启动 '...'
  2. 点击 '....'
  3. 查看

[或者可以直接贴源代码]

pages.json
{
"pages": [ //pages数组中第一项表示应用启动页,参考:https://uniapp.dcloud.io/collocation/pages
        // #ifdef APP-PLUS
        {
            "path": "pages/main/index"
        },
        // #endif
        {
            "name": "login",
            "path": "pages/login/index",
            "style": {
                "navigationBarTitleText": "登录",
                "app-plus": {
                    "navigationStyle": "custom",
                    "titleNView": false
                }
            }
        },
        {
            "name": "home",
            "path": "pages/index/index",
            "style": {  
                "navigationBarTitleText": "首页",
                "app-plus": {
                    "navigationStyle": "custom",
                    "titleNView": false
                }
            }
        }, {
            "name": "mine",
            "path": "pages/mine/index",
            "style": {
                "navigationBarTitleText": "我的",
                "app-plus": {
                    "navigationStyle": "custom",
                    "titleNView": false
                }
            }
        },
        // TODO 测试页
        {
            "name": "test",
            "path": "pages/test/index",
            "style": {
                "navigationBarTitleText": "测试"
                // "app-plus": {
                //  "navigationStyle": "custom",
                //  "titleNView": false
                // }
            }
        }
    ]
}

router.js

import {
    RouterMount,
    createRouter
} from 'uni-simple-router';

const routeHooks = {
    '/pages/main/index': {
        beforeEnter: (to, from, next) => {
            next({
                name: 'home',
                NAVTYPE: 'replaceAll'
            })
        }
    }
}

const router = createRouter({
    platform: process.env.VUE_APP_PLATFORM,
    APP: {
        //设置等待页面背景色
        loadingPageStyle: () => JSON.parse('{"backgroundColor":"#96DBF3"}'),
        // 通过启动页生命钩子绘制加载gif
        loadingPageHook: (view) => {
            console.log('------------loadingPageHook--------------')
            view.hide();
        },
        launchedHook: () => {
            console.log('------------launchedHook--------------')
            plus.navigator.closeSplashscreen();
            view.show()
        },
    },
    routes: ROUTES.map(route => {
        if (routeHooks[route.path]) {
            return Object.assign({}, route, routeHooks[route.path])
        }
        return route
    })
});

//全局路由前置守卫
router.beforeEach((to, from, next) => {
    console.log('to=======>', to)
    next();
});

// 全局路由后置守卫
router.afterEach((to, from) => {
    console.log('跳转结束')
})

export {
    router,
    RouterMount
}

预期结果 跳转到首页

实际结果 simulator_screenshot_781A6E6E-9C07-44BA-907C-EE1BB948CDD3

系统信息:

补充信息 未开启fast启动模式和纯nvue image

SilurianYang commented 2 years ago

pages/main/index 这个是vue文件还是Nvue 文件?

luck-hao commented 2 years ago

pages/main/index 这个是vue文件还是Nvue文件?

vue

luck-hao commented 2 years ago

pages/main/index 这个是vue文件还是Nvue文件?

image

SilurianYang commented 2 years ago

image 是因为其他报错引起的吗?

luck-hao commented 2 years ago

不是的 我注释掉后重新编译运行 还是一样白屏,并且控制台无任何报错: image image

SilurianYang commented 2 years ago

方便把DEMO发送给我吗? 我现在方便调试

luck-hao commented 2 years ago

方便把DEMO发送给我吗? 我现在方便调试

麻烦给一下邮箱,麻烦大佬了

SilurianYang commented 2 years ago

1606726660@qq.com

luck-hao commented 2 years ago

1606726660@qq.com 大佬,已经发了,麻烦了

SilurianYang commented 2 years ago

两处错误

1、不能定义app.vue <template></template> 必须要用uni-app内置的挂载,否则uni-app本身就会白屏 2、必须为 app.vue 定义 mpType = 'app' 你可以在app.vue中导出,也可以在main.js中指定

image image

luck-hao commented 2 years ago

两处错误

1、不能定义app.vue <template></template> 必须要用uni-app内置的挂载,否则uni-app本身就会白屏 2、必须为 app.vue 定义 mpType = 'app' 你可以在app.vue中导出,也可以在main.js中指定

image image

好的,傻了,谢谢大佬