Vue.js 2 Web Development Projects

Binding attributes

Among other elements, <textarea> has some handy attributes we would like to use, such as the rows attribute. We could create a prop for each of them, but this could become tedious very quickly. Instead, we are going to use the handy $attrs special property of the Vue component, which gets all the non-prop attributes set on the component as an object with the keys being the names of the attributes.

This means that if you have let's say, one text prop on your component and that you write this in another component:

<FormInput :text="username" required>

Vue will treat required as an attribute, since it is not in the list of props exposed by the FormInput component. Then you can access it with $attrs.required!

The v-bind directive ...