This is a valid use case for which a more elegant option from the framework would be helpful.

For our requirement, we wanted all controls to be flat and bordered, so we went ahead with the following solution:

// commattribs.js
export default {
   flat: true,
   bordered: true
}

then customized individual components that we use to make use of the above attributes:

<template>
  <q-card
    v-bind="attrs"
    v-on="$listeners"
  >
    <template
      v-for="(_, slot) of $scopedSlots"
      v-slot:[slot]="scope"
    >
      <slot
        :name="slot"
        v-bind="scope"
      />
    </template>
  </q-card>
</template>

<script>
import cattribs from './comm-attribs'
export default {
  name: 'ACard',
  computed: {
    attrs () {
      return {
        ...cattribs,
        ...this.$attrs
      }
    }
  }
}
</script>

so if we needed to customize all components with some other attribute, we change them up in commattribs.js

This is a valid use case for which a more elegant option from the framework would be helpful.

For our requirement, we wanted all controls to be flat and bordered, so we went ahead with the following solution:

// commattribs.js
export default {
   flat: true,
   bordered: true
}

then customized individual components that we use to make use of the above attributes:

<template>
  <q-card
    v-bind="attrs"
    v-on="$listeners"
  >
    <template
      v-for="(_, slot) of $scopedSlots"
      v-slot:[slot]="scope"
    >
      <slot
        :name="slot"
        v-bind="scope"
      />
    </template>
  </q-card>
</template>

<script>
import cattribs from './comm-attribs'
export default {
  name: 'ACard',
  computed: {
    attrs () {
      return {
        ...cattribs,
        ...this.$attrs
      }
    }
  }
}
</script>

so if we needed to customize all components with some other attribute, we change them up in commattribs.js