class MessageBag {
set (errors) {
// Нужно при вызове этого метода сообщать об изменениях в компонент
this.errors = errors;
}
has (key) {
return this.errors.hasOwnProperty(key)
}
}
class Validator {
constructor (component) {
this.errors = new MessageBag;
this.component = component;
this.update();
}
handle (errors) {
this.errors.set(errors);
}
update () {
this.errors.set({ /* Empty object */ });
}
}
module.exports = (component) => {
return new Validator(component);
}
В компоненте:
created () {
this.$validator = require('../../validator')(this);
},
<div :class="[{ 'has-error': $validator.errors.has('title') }, 'form-group']">
<label class="control-label" for="title">Заголовок</label>
<input id="title" name="title" type="text"
class="form-control" v-model="form.title">
</div>
Как такое можно реализовать?