title: Uncaught (in promise) undefined - Vue-router
body: <p>I'm facing a really strange issue where if a user with restricted permissions tries logging into my web app, they see the following error:</p>
  
  <p><code>Uncaught (in promise) undefined</code></p>
  
  <p>But this doesn't happen with users who have max permissions.</p>
  
  <p>I think the issue is being caused by the re-reoute. If the user does not have page_access 1, it then routes to /holidays. The other strange thing is that this error only ever appears the once, and that's when the user first logs in. If the page is refreshed or the user navigates away to other pages, it does not appear.</p>
  
  <p><strong>router.js</strong></p>
  
  <pre><code>Vue.use(Router)
  
  const router = new Router({
  
    routes: [
      {
        path: '/',
        name: 'dashboard',
        component: Dashboard,
        beforeEnter(to, from, next) {
          if(localStorage.token) {
            if(localStorage.page_access.indexOf('1') != -1 &amp;&amp; localStorage.page_access != null) {
              next('/holidays');
            }
            else {
              next();
            }
          } else {
            next('/login');
          }
        }
      },
      {
        path: '/holidays',
        name: 'holidays',
        component: Holidays,
        beforeEnter(to, from, next) {
          if(localStorage.token) {
            next();
          } else {
            next('/login');
          }
        }
      },
    ],
    mode: 'history'
  })
  
  router.beforeResolve((to, from, next) =&gt; {
  
    if(localStorage.token &amp;&amp; from.name != 'login' &amp;&amp; to.name != 'login') {
      store.dispatch('autoLogin')
      .then(response =&gt; {
        store.dispatch('getNavigation');
        next();
      })
      .catch(err =&gt; {
        console.log(err);
      });
    }
    else if(from.name &amp;&amp; !localStorage.token) {
      router.go('/login');
    }
    else {
      next();
    }
  });
  
  export default router;
  </code></pre>
  
  <p><strong><em>store.js</em></strong></p>
  
  <pre><code>async autoLogin({commit}) {
      const token = localStorage.getItem('token');
      const remember_token = localStorage.getItem('remember_token');
  
      if(!token) {
        return;
      }
  
      try {
        const res = await axios({
        method: 'post',
        data: { userId: localStorage.user_id, token: localStorage.remember_token },
        url: 'https://controlapi.totalprocessing.com/api/get-user',
        config: { headers: { 'Content-Type': 'application/x-www-form-urlencoded' }}
        })
        .then(response =&gt; {
          if(response.data.remember_token == remember_token) {
            commit('authUser', { token: token });
            return response;
          }
          else {
            localStorage.clear();
            return null;
          }
        })
        .catch(e =&gt; {
            this.errors.push(e);
            return e;
        })
        return res;
      }
      catch(e) {
        console.log(e);
        return e;
      }
  }
  </code></pre>
  
  <pre><code>getNavigation({commit}) {
      let pageAccess = localStorage.page_access == 'null' ? null : localStorage.page_access;
      let subPageAccess = localStorage.sub_page_access == 'null' ? null : localStorage.sub_page_access;
  
      axios({
      method: 'post',
      data: { pageAccess: pageAccess, subPageAccess: subPageAccess },
      url: 'https://controlapi.totalprocessing.com/api/client-get-navigation',
      config: { headers: { 'Content-Type': 'application/x-www-form-urlencoded' }}
      })
      .then(response =&gt; {
      console.log(response.data);
          const data = response.data;
          const tree = [];
  
          data.reduce(function(a, b, i, r) {
  
              // Add the parent nodes
              if(a.page_id != b.page_id){
                  tree.push({ page_id: a.page_id,
                              page_name: a.page_name,
                              page_path: a.path,
                              page_icon: a.page_icon
                              });
              }
  
              // Add the last parent node
              if(i+1 == data.length) {
                  tree.push({ page_id: b.page_id,
                              page_name: b.page_name,
                              page_path: b.path,
                              page_icon: b.page_icon
                              });
  
                  // Add the child nodes to the parent nodes
                  data.reduce(function(a, b) {
                      if(a.sub_page_id) {
                          const find = tree.findIndex(f =&gt; f.page_id == a.parent_id);
  
                          // Add the first child node to parent
                          if(!("children" in tree[find])) {
                              tree[find].children = [];
  
                              tree[find].children.push({ page_id: a.sub_page_id,
                                                      page_name: a.sub_page_name,
                                                      page_path: a.sub_page_path,
                                                      page_icon: a.sub_page_icon
                              });
                          }
                          // Add the remaining child nodes to parent nodes
                          else {
                              tree[find].children.push({ page_id: a.sub_page_id,
                                                      page_name: a.sub_page_name,
                                                      page_path: a.sub_page_path,
                                                      page_icon: a.sub_page_icon
                              });
                          }
                      }
                      return b;
                  });
              }
              return b;
          });
  
          commit('authNav', {
          navigation: tree
          });
      })
      .catch(e =&gt; {
          this.errors.push(e)
      })
  }
  </code></pre>