How to make the header style in one component one, and in another component another?

Question

Vue.js

The header is in a common wrapper and is visible on all component pages, I need it to have one style on the main page, and another style on all others, in my case the background transparent changes to background #ccc

Answer 1

<div :class="headerClass">

computed: {
  headerClass() {
    return в зависимости от this.$route;
  },
},

UPD. https://jsfiddle.net/ch80oday/