Routing with beforeEnter

Questions
1

Hello, I wanted to make a simple Login with local users and a checkAuth in routes.js, if the username is available i can go to ‘/’, if not, I stay on the login page. The problem is even if I get true, I dont get to the ‘/’ and stay on the login page, even when I get “true” in console.

this is the input of the username:

<input type="text" placeholder="Benutzername" id="demo-username-2" class="input-with-value" autocomplete="off">

the button where you can go to ‘/’ page

<li><a href="/" @click="valueExists" class="list-button gobutton">go</a></li>

script where username is saved in the localstorage

valueExists: function () {

        var $ = this.$;

        var app = this.$app;

        var router = this.$router;

        var username = $('input#demo-username-2').val();

        var password = $('input#demo-password-2').val();

        const arr = [

                      {

                      id: 19,

                      username: "Arkansas",

                      password: 198,

                      }, 

                      {

                      id: 21,

                      username: "Blofeld",

                      password: 216,

                      }, 

                      {

                      id: 38,

                      username: "Gollum",

                      password: 147,

                      }

                    ];

                      console.log(arr.some(item => item.username === username));

                      localStorage.setItem("Check", arr.some(item => item.username === username));

                  }

                       }};

routes.js snippet:

function checkAuth(to, from, resolve, reject) {

  var router = this;

  

  if (localStorage.Check == true) {

    alert(localStorage.Check);

    resolve();

    router.navigate('/');

  } else {

    reject();

    router.navigate('/login/');

  }

}

var routes = [

  {

    path: '/',

    component: HomePage,

    beforeEnter: checkAuth

  },

  {

    path: '/login/',

    component: LoginPage,

  },
2

This is wrong, it should be just first line resolve();

I can not see anywhere in your code where you are trying to load/navigate somewhere on login success. Setting localStorage won’t do anything. You need to navigate to this route again or use

router.navigate('/', { reloadCurrent: true })

on login

3

you mean likes this? Sorry, im really confused now

function checkAuth(to, from, resolve, reject) {

  var router = this;

  

  if (localStorage.Check == true) {

    alert(localStorage.Check);

    resolve();

    router.navigate('/', { reloadCurrent: true })

  } else {

    alert(localStorage.Check);

    reject();

    router.navigate('/login/');

  }

}