Роут vue и его компонент

сделал роутер, сделал роутер на about и home, хочу что бы при переходе на about треугольника справа - не было, а на home - был. Но как-то всё идёт не по плану, т.е. обновил страницу и появился треугольник, когда зашёл на about треугольник исчез - браво, но при переходе на home - треугольника уже нет. В чём проблема и как правильно нужно написать? ABOUT:

  <div class="about">
    <h1 class='hh1'>Это инфо-комната</h1>
  </div>
</template>
<style>
.about{
  position: absolute;
  
}

body {background: linear-gradient(120deg, #fff 75%, #fff 25%);}
</style> ```


HOME: 
<template>
  <div class="home">
    
    
  </div>
</template>
<style>
  body {background: linear-gradient(120deg, #fff 75%, #1359C8 25%);}
</style>

<script>
// @ is an alias to /src
import HelloWorld from '@/components/HelloWorld.vue'

export default {
  name: 'Home',
  components: {
    HelloWorld
  }
}
</script>