[Vuejs]-Dynamically add arbitrary attributes to a Vue component element?

by

0👍

Just set the inheritAttrs to false. Then make use of $attrs to bind the attributes on the input element

Vue.component('text-input',{
  inheritAttrs: false,
  template: `<input type="text" v-model="value" :name="name" v-bind="$attrs">`,
  props:['value','name']
});

Now just add the attributes on the component like you would to a regular input

<text-input :value="avalue" :name="aname" placeholder='Your name' title='Required' data-extrainfo='arbitrary data'> </text-input>

Leave a comment