VUE嵌套路线会显示空白页

时间:2020-08-13 07:44:17

标签: vue.js vue-router

我的例程返回儿童路线的空白页。在网络上进行了检查,但找不到任何有用的信息。我有以下设置。

同一个index.js文件中的Vue路由

    {
        path: "/admin",
        name: "Admin",
        component: Admin,
        
        children:[
            
          {
            path: "/scheduler",
            name: "Scheduler",
            component: Scheduler,
            meta: {
              role: "user",
              middleware: [auth],
              requiresAuth: true,
            },
          },
          
        ],
        meta: {
          role: "user",
          middleware: [auth],
          requiresAuth: true,
        },
      },

我的beforeEach:

    router.beforeEach((to, from, next) => {
      if (to.matched.some((record) => record.meta.requiresAuth)) {
        if (window.localStorage.getItem("token") == null) {
          next({
            path: "/login",
            query: {
              redirect: to.fullPath,
            },
          });
        } else {
          const localData = JSON.parse(window.localStorage.getItem("user")).role;
    
          const middleware = to.meta.middleware;
          
          const context = { to, from, next };
    
          //If there is no error from Auth, Unauthorized 
    
          if (store.getters.errorDetails == null) {
            middleware[0]({ ...context }).then(() => {
              if (localData == "user" && to.meta.role == "user") {
                if (to.meta.role == "admin") {
                  next("/user");
                }
                next("/user");
              } else if (localData == "admin" && to.meta.role == "admin") {
                if (to.meta.role == "user") {
                  next("/admin");
                } else {
                  next("/admin");
                }
              } else {
                next("/login");
              }
            });
          }
        }
      } else {
        next();
      }
    });

,我可以看到以下屏幕。不知道我在做什么错。任何帮助表示赞赏。

enter image description here

0 个答案:

没有答案