formkit-validation-helper ·

This helper utility creates a FormKit validation string or array from an object containing key/label pairs.

See the FormKit validation page regarding validating fields with the string or array syntax.

Usage

<script setup>
import { generateValidationString, generateValidationArray } from 'formkit-validation-helper';

const selectOptions = { dog: 'Dog', cat: 'Cat', mouse: 'Mouse' };

const validationString = generateValidationString(selectOptions); //=> 'dog,cat,mouse'
const validationArray = generateValidationArray(selectOptions); //=> ['dog', 'cat', 'mouse']
</script>

<template>
  <FormKit
    type="select"
    name="first_animal"
    label="Animal"
    placeholder="Select first animal"
    :options="selectOptions"
    :validation="`required|is:${validationString}`"
  />

  <!-- OR -->

  <FormKit
    type="select"
    name="second_animal"
    label="Animal"
    placeholder="Select second animal"
    :options="selectOptions"
    :validation="[['required'], ['is', ...validationArray]]"
  />
</template>

Note

Only uses the object keys and not the values.

{ dog: 'Dog', cat: 'Fox' } //=> 'dog,cat'