Resumo do problema
O componente MobileNavigation não consegue lidar corretamente com itens da barra de navegação que possuem subrotas (como ocorre no componente Sidebar).
Quando um item de navegação possui filhos (children), o MobileNavigation tenta realizar a navegação diretamente para uma rota que não existe ou não está definida corretamente, resultando no erro do Vue Router:
chunk-543UTXVO.js?v=2b721f9d:2658 Uncaught TypeError: Cannot read properties of null (reading 'state')
at pushWithRedirect (vue-router.js?v=6dc8e4d8:1964:21)Passos para reproduzir
Utilizar exemplo de estrutura:
const items = [
{
label: 'Início',
icon: 'home-outline',
type: 'route',
ìtems: [
{
label: 'Categorias',
route: {
path: 'categories',
name: 'index-categories',
},
},
],
},Como testar
- Acessar a aplicação em modo mobile ou reduzir a largura da tela para exibir o componente MobileNavigation.
- Clicar em um item da navegação que possui subrotas (ex.: item que no Sidebar expande e mostra opções internas).
- Não é exibido as rotas subitens.
Qual o comportamento esperado?
- Funcionar como o componente SideBar que consegue mostrar subitems dos itens
Resumo do problema
O componente MobileNavigation não consegue lidar corretamente com itens da barra de navegação que possuem subrotas (como ocorre no componente Sidebar).
Quando um item de navegação possui filhos (children), o MobileNavigation tenta realizar a navegação diretamente para uma rota que não existe ou não está definida corretamente, resultando no erro do Vue Router:
Passos para reproduzir
Utilizar exemplo de estrutura:
Como testar
Qual o comportamento esperado?