Vue.js: элемент отображается на мгновение, несмотря на условный рендеринг

У меня есть навигация с кнопкой, которая переключает меню и кнопкой входа.

Когда пользователь не авторизован, он может видеть только кнопку «Войти». Когда пользователь входит в систему, эта кнопка исчезает, и он / она может видеть кнопку гамбургера, которая переключает меню пользователя.

У меня есть условие на основе атрибута isLoaded, который может быть ложным или истинным в зависимости от ответа API (загружены ли данные профиля или нет, что происходит после входа в систему). Он работает правильно, но кнопка «Войти» появляется на мгновение, когда я перезагружаю страницу и после перенаправления на главную страницу после процесса входа. Интересно, как мне этого избежать.

Я подозреваю, что эта кнопка отображается, когда приложение ожидает ответа API, и как только оно видит isLoaded: true, оно скрывает кнопку после проверки условия.

Вот мой код:

<v-toolbar app fixed dark color = "light-blue lighten-2">
  <user-nav-button v-if = "getProfile.isLoaded"
                   @toggle-drawer = "$refs.drawer.drawer = !$refs.drawer.drawer" />
  <v-toolbar-title v-if = "getProfile.isLoaded">
    <router-link :to = "{ name: '/' }"
                 class = "white--text" >
      APP
    </router-link>
  </v-toolbar-title>
  <v-spacer></v-spacer>
  <router-link :to = "{ name: 'login' }"
               class = "sign-in-button"
               v-if = "!getProfile.isLoaded">
    SIGNIN
  </router-link>
</v-toolbar>
<profile-sidebar v-if = "getProfile.isLoaded"
                 ref = "drawer" />

<script>
export default {
data() {
 return {
  drawer: '',
 };
},
components: {
  UserNavButton,
  ProfileSidebar,
  MainFooter,
 },
 created() {
  this.loadProfile();
 },
 computed: {
  ...mapGetters(['getProfile']),
 },
 methods: {
  ...mapActions(['loadProfile']),
 },
};
<script>

Мой магазин:

export default {
 state: {
 profile: {
  isLoaded: false,
  data: [],
  },
},
actions: {
 loadProfile({ commit }) {
  if (config.token !== '') {
    http
      .post('api')
      .then(({ data }) => {
        commit('SET_PROFILE', data);
      });
  }
 },
},
mutations: {
 SET_PROFILE(state, data) {
  state.profile = {
    isLoaded: true,
    data,
  };
 },
},
getters: {
 getProfile(state) {
  return state.profile;
  },
 },
};