vue-router中的Javascript函数问题

ubby3x7f  于 2023-01-14  发布在  Vue.js
关注(0)|答案(1)|浏览(194)

我有一个授权用户的函数,所以用户对某些组件有限制,这个函数和'beforeEnter'导航卫士配合得很好,如何在每个路由器卫士之前使用/编写相同的函数?
我试着在beforeEach中编写函数,但是javascript函数(forEach、includes..)在router.beforeEach中不起作用。
此函数用于授权

function authorizeUser(to) {
  const currentUser = store.getters["auth/isCurrentUser"];
  console.log(currentUser);
  currentUser.teams.forEach((team) => {
    const validPermissions = team.permissions.filter((item) => { return to.meta.neededPermissions.includes(item.permissionType); }); //returns array of objects
    const mappedValidPermissions = validPermissions.map((item) => { return item.permissionType;  });// returns array with permissionType
    // returned matched permissions
    console.log(
      JSON.stringify(to.meta.neededPermissions),
      JSON.stringify(mappedValidPermissions),  
    );
    if (!to.meta.neededPermissions.every(i=>mappedValidPermissions.includes(i))) {
      router.push({ path: "/:notFound(.*)" });     
    }  
  });
}

这是router.beforeEach导航仪

router.beforeEach((to, from, next) => { 
  if (to.meta.requiresAuth && !store.getters["auth/isLoggedIn"]) {
    next({
      name: "Authentication",
      params: {
        desiredRoute: to.fullPath,
      },
    });
  } else {
    next();
  }
});

如何利用上述函数和beforeEach中的if condition,以便在访问之前检查每个路由器链接?

t9aqgxwy

t9aqgxwy1#

您使用的是什么版本的vue-router。当前版本的beforeEach签名已更改。您可以选择返回false或路由位置对象,而不是调用next

相关问题