How to pass variables to components?

Question

JavaScript

Hello. I want to make a night theme on the site. To do this, I created the BackgroundChange.vue component, in which I create a method that will change the background of the site and the background of some blocks.
Look at my structure: I include
the BackgroundChange component in the Navbar component, and I include the Navbar component in the parent App component. In the parent component, the Header component is connected, for example, in the Header component, I add the v-bind:class="{backgroundChange: isActive}", isActive = false attribute to div.header.
How to change isActive to true from the BackgroundChange component? And so are all the other components. What do you suggest?
Or is there another solution? Tell.

Answer 1

1) vuex
2) make a global event bus, trigger changes in bcgchanger, and listen to them in each component, and if our properties change, we save them in our component (and there is reactivity and everything).