[Vuejs]-Why is my false conditional element fickering while route is loading?

by

0👍

✅

I was able to find out the problem. The get request was not retrieving the data as fast as it took to render the page. So I had to use beforeRouteEnter to the retrieve the data before the component renders

Like so:

beforeRouteEnter(to, from, next) {
    axios
      .get("http://localhost:3000/budget", {
        headers: { "Content-Type": "application/json" },
        withCredentials: true
      })
      .then(res => {
        next(vm => {
          vm.userName = res.data.name;
          vm.myExpenses = res.data.budget[0].expenses;
          vm.earnings = res.data.budget[0].earnings;
        });
      })
      .catch(err => {
        next(vm => {
          vm.err = err;
        });
      });
  }

Leave a comment