php - Problème avec l'ajout dynamique de routage dans Vue-Router

Question

Brève description

Récemment, j'ai étudié la question du contrôle des autorisations basé sur RBAC sous la séparation du front et du backend Lors de l'utilisation de vue-router pour ajouter dynamiquement des routes, un petit problème est survenu.

p>

L'idée générale est la suivante :

• Une fois que l'utilisateur en arrière-plan s'est connecté avec succès, la liste des autorisations correspondant à l'utilisateur est obtenue du serveur et stockée dans sessionStorage

• Rediriger les utilisateurs vers la page d'accueil du backend

• Dans le hook router.beforeEach(), lisez les données de la liste d'autorisations dans sessionStorage et appelez router.addRoutes() pour ajouter dynamiquement des routes.

Code

 router.beforeEach (vers, depuis, suivant)
    {
        ...
        let permission = JSON.parse(window.sessionStorage.getItem('permission'))
        /*permission = [...{"client_route":"/test"}...]*/
        si (autorisation) {
            laissez newRoutes = []
            permission.map((élément, index) => {
                newRoutes.push({
                    chemin : '${item.client_route}',
                    composant : '../view${item.client_route.slice(1)}.vue',
                    méta : {Auth : true}
                })
            })
            router.addRoutes(newRoutes)
        }
        ...
    

Voici le problème

1. Y a-t-il un problème avec cette idée ?

2. Il y a un problème avec le code ci-dessus. Je ne sais pas comment gérer le ${} dans le chemin et le composant. Pardonnez-moi de ne pas bien apprendre es6 ╮(. ︶﹏︶")╭. Mon intention initiale est de charger le fichier .vue

en fonction du nom de la route renvoyé.

Merci à tous

Answer 1

Dans es6, ${} est entouré de guillemets``，你的是单引号'', donc la mission échoue