# Error when navigating with tabs

**URL:** <https://forum.ionicframework.com/t/error-when-navigating-with-tabs/200692>\
**Category:** Ionic Vue\
**Created:** [December 4, 2020, 4:51am UTC](https://forum.ionicframework.com/t/error-when-navigating-with-tabs/200692 "2020-12-04T04:51:34Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![tkclark](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/tkclark/32/144585_2.png) [@tkclark](https://forum.ionicframework.com/u/tkclark)\
**Post date:** [December 4, 2020, 4:51am UTC](https://forum.ionicframework.com/t/error-when-navigating-with-tabs/200692/1 "2020-12-04T04:51:34Z")

</div>

I updated all my ionic/ionic-vue packages and now I’m getting the following error in the JS console:  
`Uncaught (in promise) TypeError: Cannot read property 'tab' of null`

That line is:  
`const activeChild = childNodes.find((child) => child.props.tab === activeTab);`

When I debug this line, I can see `childNodes[3].props.tab` resolves to “help” and `activeTab` resolves to “help” too. Really confused.

I’m also getting the error when navigating (not by the tab bar):  
`Uncaught (in promise) TypeError: Cannot read property 'classList' of undefined`

Which goes back to this line:  
`leavingEl.classList.add('ion-page-hidden');`

What should I do? Rebuild the tab project from scratch?

I don’t think I’m doing anything weird. I have routes setup so you have to login with Firebase before you see the tab bar. But everything seems to be good with that. Let me know what code I need to share. Thanks!

---

<div class="post-metadata">

**Author:** ![ldebeasi](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/ldebeasi/32/147501_2.png) [@ldebeasi](https://forum.ionicframework.com/u/ldebeasi)\
**Post date:** [December 4, 2020, 3:36pm UTC](https://forum.ionicframework.com/t/error-when-navigating-with-tabs/200692/2 "2020-12-04T15:36:26Z")

</div>

Can you share an example or GitHub repo? Hard to say what the issue is without being able to reproduce the issue myself.

---

<div class="post-metadata">

**Author:** ![tkclark](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/tkclark/32/144585_2.png) [@tkclark](https://forum.ionicframework.com/u/tkclark)\
**Post date:** [December 4, 2020, 5:25pm UTC](https://forum.ionicframework.com/t/error-when-navigating-with-tabs/200692/3 "2020-12-04T17:25:12Z")

</div>

Hi Liam, I will start with a fresh project and setup the different views (errr vues?) and then see if the problem persists. If so, I’ll make that the repo that I share! I’ll get back to you in a couple hours!

---

<div class="post-metadata">

**Author:** ![tkclark](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/tkclark/32/144585_2.png) [@tkclark](https://forum.ionicframework.com/u/tkclark)\
**Post date:** [December 4, 2020, 6:17pm UTC](https://forum.ionicframework.com/t/error-when-navigating-with-tabs/200692/4 "2020-12-04T18:17:39Z")

</div>

OMG, I figured it out and it’s so dumb! 🤦🏻‍♂️ So here was my navigation structure:

- Intro screen (no tabs): This screen has a login modal which redirects to Tab 1
- Tabs  
- Tab 1  
- Tab 2  
- Tab 3  
- Tab 4  
- Logout: This button brings you back to Intro

So I was getting the error in two places. On navigation from Intro to Tab 1 and from Logout to Intro. Turns out I didn’t have a `<ion-page>` inside the `<template>` inside the `Intro.vue` file. It went from `<template>` to `<ion-content>` and that caused all of this! Ugh!