Vue3 implémente la fonction de menu dynamique

Annuaire d'articles

  • 0. Démonstration d'effet
  • 1. Construisez un projet Vue3
    • 1.1 Créer un projet Vue3 avec un échafaudage vite
    • 1.2 Définir l'alias du fichier
    • 1.3 Installer et configurer element-plus
    • 1.4 Installer et configurer le routage
  • 2. Page de connexion
  • 3.Page de gestion du backend
    • 3.1 Construire le cadre d'arrière-plan
    • 3.2 Barre de menu de gauche
    • 3.3 informations utilisateur d'en-tête
    • 3.4 Contenu principal
    • 3,5 pieds
  • 4. Configurer le routage statique
  • 5. Menu d'activation de l'enregistrement
    • 5.1 el-menu lie l'attribut actif par défaut
    • 5.2 Ajouter un événement de clic au menu
    • 5.3 Initialiser le menu d'activation
  • 6. Routage dynamique
    • 6.1 Connexion réussie et stockage des données
    • 6.2 Le garde de navigation d'itinéraire configure dynamiquement les itinéraires
    • 6.3 Résoudre le problème de la page vierge après avoir actualisé la page
  • 7. Code complet

Principales étapes :
Insérer la description de l'image ici

0. Démonstration d'effet

Insérer la description de l'image ici

1. Construisez un projet Vue3

1.1 Créer un projet Vue3 avec un échafaudage vite

npm create vite@latest vue3-zhifou -- --template vue

Entrez l'éditeur de code dans le dossier du projet que vous venez de créer.

#安装依赖
 npm

Je suppose que tu aimes

Origine blog.csdn.net/bjzhang75/article/details/142642749
conseillé
Classement