Vue3 implementa função de menu dinâmico

Diretório de artigos

  • 0. Demonstração de efeito
  • 1. Construa um projeto Vue3
    • 1.1 Criar projeto Vue3 com andaime vite
    • 1.2 Definir alias do arquivo
    • 1.3 Instalar e configurar o elemento plus
    • 1.4 Instalar e configurar o roteamento
  • 2. Página de login
  • 3.Página de gerenciamento de back-end
    • 3.1 Construa a estrutura de fundo
    • 3.2 Barra de menu esquerda
    • 3.3 informações do usuário do cabeçalho
    • 3.4 Conteúdo principal
    • 3,5 rodapé
  • 4. Configure o roteamento estático
  • 5. Menu de ativação de gravação
    • 5.1 el-menu vincula o atributo ativo padrão
    • 5.2 Adicionar evento de clique ao menu
    • 5.3 Inicializar menu de ativação
  • 6. Roteamento dinâmico
    • 6.1 Login e armazenamento de dados bem-sucedidos
    • 6.2 O guarda de navegação de rota configura rotas dinamicamente
    • 6.3 Resolva o problema da página em branco após atualizar a página
  • 7. Código completo

Etapas principais:
Insira a descrição da imagem aqui

0. Demonstração de efeito

Insira a descrição da imagem aqui

1. Construa um projeto Vue3

1.1 Criar projeto Vue3 com andaime vite

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

Insira o editor de código na pasta do projeto que você acabou de criar.

#安装依赖
 npm

Acho que você gosta

Origin blog.csdn.net/bjzhang75/article/details/142642749
Recomendado
Clasificación