Как увидеть завершение загрузки прогресс бара?

Смотрел варианты создания баров на JS в интернете и ничего не понял)
Поэтому написал свой простой велосипед:

Компонент с баром от бутстрапа, который берет данные из пропса

<div class="progress">
    <div class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" :aria-valuenow="this.progress" aria-valuemin="0" aria-valuemax="100" :style="'width: '+this.progress+'%'"></div>
  </div>

Показываю компонент пока прогресс не станет 100:

<progress-component v-if="progress < 100"
              :progress="progress"
              >
              </progress-component>

В финале методов заполняю прогресс

fetchMetod() {
                    this.progress = this.progress + 10
        },

А контент показываю условием после всех фетчей

<div v-if="progress == 100”>
Контент
</div>

И таким образом бар заполняется до 100 (равномерно распределяю по методам) и после фетчей прорисовывается контент. Но я не успеваю увидеть загрузку – обрывается на половине. И это выглядит некрасиво. Не так как на других сайтах) У них, даже если данные загрузились, то бар завершает свою визуальную загрузку. И только потом пропадает. Отсрочка какая-то? Не понимаю, как сделать. Я знаю, что вы сейчас будете советовать закончить вуз/школу/армию, но все таки - можно ли как-то простым способом (например, в моем примере) завершить загрузку бара и не сразу вырубать бар после загрузки контента? Буду благодарен за инфу.