Pass errors to custom input components

Versions:

• VueJs: 2.1.0
• Vee-Validate: 2.0

Description:

In the documentation section ‘Component Validation’, one has to pass the errors as attributes to the custom input component:

<custom-input v-validate="'required|email'" data-vv-value-path="innerValue" data-vv-name="custom" label="Email" :has-error="errors.has('custom')"></custom-input>

This can get quite verbose if one wants to also have the error message.

Would it be reasonable to have the errors passed directly to the component ?

Steps To Reproduce:

[erezmus]

I found a simple way around the problem. I simply pass the validation rules as a prop named ‘validation’

FormText.vue

<template>
  <div class="form-group row" :class="{ 'has-danger' : errors.has(name) }">
    <label class="col-sm-3 col-form-label form-control-label" :for="name">{{ label }}</label>
    <div class="col-sm-9">
      <input type="text" :id="name" :name="name" v-bind:value="value" v-validate="validation" v-on:input="onInput" :placeholder="placeholder ? placeholder : name" :readonly="readonly">
      <div class="form-control-feedback" v-if="errors.has(name)">{{ errors.first(name) }}</div>
    </div>
  </div>
</template>

<script>
export default {
  props: ['label', 'value', 'name', 'placeholder', 'readonly', 'validation'],
  methods: {
    onInput (event) {
      this.$emit('input', event.target.value)
    }
  }
}
</script>

In the parent component:

//
<form-text label="Email" name="email" v-model="email" validation="'required|email'"></form-text>
//

This seems to do the trick

[lysed-ab]

this certainly isn’t working