Vue дочерние компоненты не отображаются в соответствии с вычисленными функциями

Question

В моем приложении я создавал компонент панели мониторинга, где я мог бы отображать представление в соответствии с состоянием, которое было обработано с использованием вычисляемой функции в самом компоненте, но я обнаружил несколько необычное поведение, компонент отображает неправильный дочерний компонент.

<template>
  <div class="dashboard-wrapper">
    <div class="dashboard-content">
      <LoaderView v-if="isViewLoading"/>
      <div v-else>
        <ActivityView v-if="currentView === 'Activity' " />
        <SubscriptionView v-if="currentView == 'Subscriptions'"/>
        <ProfileView v-if="currentView == 'Profile'"/>
        <SecurityView v-if="currentView == 'Security'"/>
      </div>
    </div>
  </div>
</template>

<script lang="ts">
.
.
.
get currentView () {

    return Activity.activeView
}
.
.
.
</script>

Кроме того, я проверил Vue dev tools, и состояние было соответственно обновлено. Просто чтобы отметить, я проверил, дочерние компоненты в порядке.