L'entrée cachée
utilise l'entrée cachée native HTML. Ce n'est pas un élément visible, et ne devrait être utilisé que pour fournir des données qui ne sont pas saisies par un utilisateur.
Puisque les entrées cachées
ne sont pas destinées à être affichées aux utilisateurs finaux, FormKit ne rend pas les fonctionnalités courantes orientées utilisateur telles que le label
, le texte d'aide
, ou les messages
.
Les règles de validation peuvent toujours être appliquées à une entrée cachée qui empêchera un formulaire d'être soumis, mais veuillez noter que les erreurs ne seront pas affichées sur cette entrée cachée.
Par défaut, tous les éléments HTML <input>
natifs renvoient une valeur de type chaîne. La propriété number
vous permet de convertir la valeur en un véritable type number
. Il existe deux valeurs valides pour la propriété number
: float
et integer
.
Ces options utilisent parseFloat
(par défaut) ou parseInt
respectivement. Si la valeur ne peut pas être analysée par la fonction respective, elle définira la valeur sur undefined
. De plus, l'application de la propriété number
contraindra la value
de l'entrée à être exclusivement number | undefined
en TypeScript.
L'entrée cachée
n'a qu'une seule propriété unique, number
, qui peut être utilisée pour convertir la valeur de l'entrée en un type number
.
Prop | Type | Par défaut | Description |
---|---|---|---|
number | String | float | Spécifie comment convertir une valeur en nombre. Les valeurs valides sont float et integer . |
Afficher Universel props | |||
config | Object | {} | Options de configuration à fournir au nœud d'entrée et à tout nœud descendant de cette entrée. |
delay | Number | 20 | Nombre de millisecondes à attendre avant que la valeur d'une entrée ne soit déclenchée avant que le commit hook ne soit déclenché. |
dirtyBehavior | string | touched | Détermine comment le drapeau "dirty" de cette entrée est défini. Peut être défini sur touched ou compare — touched (par défaut) est plus performant, mais ne détectera pas lorsque le formulaire correspond à nouveau à son état initial. |
errors | Array | [] | Tableau de chaînes à afficher comme messages d'erreur sur ce champ. |
help | String | '' | Texte pour le texte d'aide associé à l'entrée. |
id | String | input_{n} | L'identifiant unique de l'entrée. Fournir un identifiant permet également d'accéder globalement au nœud de l'entrée. |
ignore | Boolean | false | Empêche une entrée d'être incluse dans un parent (groupe, liste, formulaire, etc). Utile lors de l'utilisation d'entrées pour l'interface utilisateur au lieu de valeurs réelles. |
index | Number | undefined | Permet d'insérer une entrée à l'index donné si le parent est une liste. Si la valeur de l'entrée est indéfinie, elle hérite de la valeur de cette position d'index. Si elle a une valeur, elle l'insère dans les valeurs de la liste à l'index donné. |
label | String | '' | Texte pour l'élément label associé à l'entrée. |
name | String | input_{n} | Le nom de l'entrée tel qu'identifié dans l'objet de données. Cela doit être unique au sein d'un groupe de champs. |
parent | FormKitNode | contextual | Par défaut, le parent est un groupe d'enrobage, une liste ou un formulaire — mais cette propriété permet une affectation explicite du nœud parent. |
prefix-icon | String | '' | Spécifie une icône à placer dans la section prefixIcon . |
preserve | boolean | false | Conserve la valeur de l'entrée sur un groupe parent, une liste ou un formulaire lorsque l'entrée est démontée. |
preserve-errors | boolean | false | Par défaut, les erreurs définies sur les entrées à l'aide de setErrors sont automatiquement effacées lors de l'entrée, en définissant cette propriété sur true, l'erreur est maintenue jusqu'à ce qu'elle soit explicitement effacée. |
sections-schema | Object | {} | Un objet de clés de section et de valeurs partielles de schéma, où chaque partie de schéma est appliquée à la section respective. |
suffix-icon | String | '' | Spécifie une icône à placer dans la section suffixIcon . |
type | String | text | Le type d'entrée à afficher à partir de la bibliothèque. |
validation | String, Array | [] | Les règles de validation à appliquer à l'entrée. |
validation-visibility | String | blur | Détermine quand afficher les règles de validation en échec d'une entrée. Les valeurs valides sont blur , dirty et live . |
validation-label | String | {label prop} | Détermine quelle étiquette utiliser dans les messages d'erreur de validation, par défaut, elle utilise la propriété label si elle est disponible, sinon elle utilise la propriété name . |
validation-rules | Object | {} | Règles de validation personnalisées supplémentaires à rendre disponibles pour la propriété de validation. |
value | Any | undefined | Initialise la valeur initiale d'une entrée et/ou de ses enfants. Non réactif. Peut initialiser des groupes entiers (formulaires) et des listes.. |
Les entrées cachées ne rendent pas toute la balisage environnant typique des autres entrées. En tant que tel, la plupart des clés de section ne s'appliquent pas.
Section-key | Description |
---|---|
outer | L'élément d'enrobage le plus externe. |
wrapper | Un enrobage autour de l'étiquette et de l'entrée. |
label | L'étiquette de l'entrée. |
prefix | N'a pas de sortie par défaut, mais permet du contenu directement avant un élément d'entrée. |
prefixIcon | Un élément pour afficher une icône avant la section de préfixe. |
inner | Un enrobage autour de l'élément d'entrée réel. |
suffix | N'a pas de sortie par défaut, mais permet du contenu directement après un élément d'entrée. |
suffixIcon | Un élément pour afficher une icône après la section de suffixe. |
input | L'élément d'entrée lui-même. |
help | L'élément contenant le texte d'aide. |
messages | Un enrobage autour de tous les messages. |
message | L'élément (ou plusieurs éléments) contenant un message — le plus souvent des messages de validation et d'erreur. |