How not to duplicate a common component attribute (in the HTML part) in Vue.js

Question

I need to instantiate in Vue.js several times the Servicehub ->component I’m making a communication between two compelling relatives

I will always have to add the assignments below:

  :active-service-hub="serviceHubActive"
  @change-active-hub="changeActiveServiceHub"

I would like a way to add the above attributes in all Servicehub components to avoid forgetting to assign and pollution code

Below is an example of the code that would be developed.

<template>
    <service-hub
            title="Titulo do Serviço"
            slug="titulo-servico"

            :active-service-hub="serviceHubActive"
            @change-active-hub="changeActiveServiceHub"
    />
    <service-hub
            title="Outro Serviço"
            slug="outro-servico"

            :active-service-hub="serviceHubActive"
            @change-active-hub="changeActiveServiceHub"
    />

</template>

<script>

    export default {
        data() {
            return {
                serviceHubActive: ''
            }
        },
        methods: {
            changeActiveServiceHub() {
                console.log('Faz algo')
            }
        },
        components: {
            ServiceHub,
        }
    }
</script>