Skip to content

Instantly share code, notes, and snippets.

@slykar
Created August 9, 2019 12:42
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save slykar/fe79c98bcb18236c7f78d20e525986ad to your computer and use it in GitHub Desktop.
Save slykar/fe79c98bcb18236c7f78d20e525986ad to your computer and use it in GitHub Desktop.
How to specify Buefy field type more easily when doing a form validation
/**
* Returns an object with definition of <b-field :type> for Buefy.
*
* Instead of setting the field type like this:
*
* <b-field :type="{ 'is-danger': errors.has('field_name') }"></b-field>
*
* You can now use it like this:
*
* get fieldTypes() {
* return getFormFieldTypeOnError(Object.keys(this.formData), this.$validator.errors);
* }
*
* <b-field :type="fieldTypes.field_name"></b-field>
*/
export function getFormFieldTypeOnError(formKeys: string[], errorBag: ErrorBag, errorType = 'is-danger') {
const initialTypes = {};
return formKeys.reduce((fieldTypes: object, field: string) => {
const fieldTypeDef = {[errorType]: errorBag.has(field)};
return {
...fieldTypes, [field]: fieldTypeDef,
};
}, initialTypes);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment