Creating components with attribute inheritance

Since Vue 2, it has been possible to use attribute inheritance on components, but in Vue 3, attribute inheritance was made better and with a more reliable API to use in the components.

Attribute inheritance in components is a pattern that provides faster development of custom components based on HTML elements (such as custom inputs, buttons, text wrappers, or links).

In this recipe, we will create a custom input component with attribute inheritance applied directly to the input HTML element.