> ## Documentation Index
> Fetch the complete documentation index at: https://docs-dev-react-sdk-reference.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.
# Variables et fonctions utilitaires
> Apprenez à utiliser les variables dans les Formulaires pour les Actions.
Les variables vous permettent d’accéder aux données contenues dans les Formulaires et les Flux pour créer une logique commerciale et des automatismes personnalisés.
Voici quelques considérations de base sur l’utilisation des variables :
* Les variables sont entourées d’accolades `{{ variable }}`.
* Si une variable n’existe pas ou ne peut pas être résolue, elle a le même effet qu’une variable dont la valeur est `undefined (indéfini)`.
* Vous pouvez utiliser des opérateurs nuls pour gérer les variables dont la valeur est `null` ou `undefined`, par exemple :`{{fields.foo ?? fields.bar}}`.
## Variables disponibles
Vous pouvez utiliser différents types de variables pour référencer et transformer les données que vous recueillez auprès des clients avec les Formulaires et les Flux.
| Variable | \_Syntax | Where | Description |
| -------------------------- | ----------------- | ------------------ | ---------------------------------------------------------------------------- |
| Contexte | `{{contexte.*}}` | Formes / Flux | Données contextuelles de référence de la transaction en cours |
| Champs de formulaire | `{{fields. *}}` | Formulaires / Flux | Données de référence des champs de votre formulaire et des champs cachés |
| Variables partagées | `{{vars.*}}` | Formulaires / Flux | Données de référence stockées en tant que variables partagées |
| Sortie des actions de flux | `{{actions. *}}` | Flux | Données de référence de la réponse de sortie des actions de flux précédentes |
| Fonctions d’aide | `{{fonctions.*}}` | Formulaires / Flux | Fonctions d’aide pour transformer les données |
### Variables de contexte
Les Formulaires et les Flux héritent automatiquement des variables de contexte de la transaction en cours. Vous pouvez accéder aux variables de contexte suivantes :
* L’objet `user`, avec accès aux propriétés suivantes :
* `user.user_id`
* `user.username`
* `user.name`
* `user.given_name`
* `user.family_name`
* `user.nickname`
* `user.email`
* `user.email_verified`
* `user.phone_number`
* `user.phone_verified`
* `user.picture`
* `user.user_metadata`
* `user.app_metadata`
* `user.created_at`
* `user.updated_at`
* `user.last_password_reset`
* `user.identities`
* L’objet `organization`, avec accès aux propriétés suivantes :
* `organization.id`
* `organization.name`
* `organization.display_name`
* `organization.metadata`
* L’objet `client`, avec accès aux propriétés suivantes :
* `client.client_id`
* `client.name`
* L’objet `tenant (locataire)`, avec accès à la propriété suivante :
* `tenant.name`
* L’objet `transaction`, avec accès à la propriété suivante :
* `transaction.state`
```json lines theme={null}
{
"user": {
"user_id": "auth0|658409...",
"name": "ana@travel0.com",
"nickname": "ana",
"email": "ana@travel0.com",
"email_verified": true,
"picture": "https://s.gravatar.com/avatar/8eb1b522f6...",
"user_metadata": {},
"app_metadata": {},
"created_at": "2023-12-21T09:46:40.487Z",
"updated_at": "2024-05-07T10:44:26.271Z",
"last_password_reset": "2023-12-21T09:49:08.932Z",
"identities": [
{
"user_id": "6584...",
"isSocial": false,
"provider": "auth0",
"connection": "Username-Password-Authentication"
}
]
},
"client": {
"client_id": "xpeg5...",
"name": "My App"
},
"tenant": {
"name": "tenant-testing"
},
"transaction": {
"state": "hKFo2SBId2M0..."
}
}
```
Par exemple : `{{context.user.user_id}}` référence `user_id` de l’objet `user`.
### Variables des champs du formulaire
Les variables de champ contiennent les données recueillies auprès de l’utilisateur dans les champs de saisie du formulaire et les données des champs cachés. Les données de chaque champ varient en fonction du type de champ. Par exemple : `{{fields.first_name}}` référence la valeur saisie dans le champ ayant l’ID `first_name`.
### Variables des actions de sortie de flux
Lorsqu’une action de flux est exécutée, elle génère un objet qui peut être référencé dans les actions suivantes. Par exemple : `{{actions.generate_otp.code}}` référence le code résultant de l’action avec l’ID`generate_otp`.
### Variables partagées
Vous pouvez stocker des variables à partager avec des flux ultérieurs ou même avec des composants de formulaire dans la même transaction. Les variables partagées sont éphémères et sont associées à un parcours de formulaire spécifique. Leurs valeurs ne sont pas accessibles en dehors de ce parcours. Par exemple : `{{vars.external_id}}` référence la valeur d’une variable partagée avec l’ID `external_id`.
Variables partagées :
* elles sont internes (côté serveur) et ne sont pas exposées au navigateur (côté client).
* elle peuvent être résolues et exposées au navigateur si vous avez référencé une variable partagée dans le composant de formulaire.
### Fonctions utilitaires
Les fonctions utilitaires permettent de transformer les données et d’effectuer des opérations simples. Par exemple : `{{functions.toString(fields.privacy_policies)}}` transforme la valeur du champ ayant l’ID `privacy_policies` utilisant la fonction `toString()`.
Les fonctions utilitaires disponibles sont les suivantes :
| Fonction | Description | Exemple |
| -------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------- |
| toArray(value) | Convertit la valeur en un tableau | {"{{ functions.toArray('abc') }}"} // \['abc'] |
| toBoolean(value) | Convertit la valeur en valeur booléenne | {"{{ functions.toBoolean(1) }}"} // true
{"{{ functions.toBoolean(0) }}"} // false |
| length(value) | Renvoie la longueur de la valeur du paramètre | {"{{ functions.length('auth0') }}"} // 5 |
| mask(value) | Masque une valeur pour éviter l’exposition dans les exécutions | {"{{ functions.mask('my_awesome_secret') }}"} // ███ |
| toNumber(value) | Convertit la valeur en nombre | {"{{ functions.toNumber('123') }}"} // 123 |
| random(min, max, \[boolean]) | Renvoie un nombre aléatoire compris entre les valeurs minimales et maximales incluses. | {"{{ functions.random(0, 6) }}"} // 4
{"{{ functions.random(0, 6, true) }}"} // 3.8523497... |
| slice(value, start, end) | Renvoie une section d’un tableau de valeurs ou d’une chaîne de caractères entre les indices de début et de fin. | {"{{ functions.slice( 'example', 3, 5) }}"} // 'mp' |
| toString(value) | Convertit la valeur en chaîne | {"{{ functions.toString(123) }}"} // '123' |
| substring(value, start, end) | Renvoie une section d’une valeur entre les indices de début et de fin. En savoir plus sur les [différences entre les fonctions slice et substring](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/substring#differences_between_substring_and_slice) | {"{{ functions.substring( 'example', 3, 5) }}"} // 'mp' |
| toTimestamp() | Renvoie l’horodatage UNIX actuel | {"{{ functions.toTimestamp() }}"} // 1628761483 |
| toTimestamp(date) | Renvoie la date fournie en heure UNIX | {"{{ functions.toTimestamp('2021-04-30T10:02:50.876Z') }}"} // 1619776970 |
| toTimestamp(date) | Renvoie la date fournie en heure UNIX | {"{{ functions.toTimestamp('2021-04-30T10:02:50.876Z') }}"} // 1619776970 |
| replaceAll(value, string, replacement) | Renvoie une nouvelle chaîne dans laquelle toutes les correspondances d’un modèle sont remplacées par un substitut. | {"{{ functions.replaceall('2021-04-30', '-', '/') }}"} // 2021/04/30 |
| replace(value, string, replacement) | Renvoie une nouvelle chaîne dans laquelle toutes les correspondances d’un modèle sont remplacées par un substitut. Si le motif est une chaîne, seule la première occurrence sera remplacée. | {"{{ functions.replace('2021-04-30', '-', '/') }}"} // 2021/04-30 |
| split(value, separator, limit?) | Renvoie une liste ordonnée de sous-chaînes divisées par le séparateur. | {"{{ functions.split('2021-04-30', '-') }}"} // \['2021', '04', '30'] |
| now() | Renvoie la date actuelle au format ISO 8601. | {"{{ functions.now() }}"} // 2021-04-30T10:31:28.576Z |
| includes(collection, item, fromIndex?) | Renvoie le fait qu’un tableau contienne une certaine valeur parmi ses entrées. | {"{{ functions.includes(['auth0', 'identity', 'authentication'], 'identity') }}"} // true |
| indexOf(collection, item, fromIndex?) | Renvoie le premier indice auquel un élément donné peut être trouvé dans le tableau, ou -1 s’il n’est pas présent. | {"{{ functions.indexOf(['auth0', 'identity', 'authentication'], 'identity') }}"} // 1 |
| merge(base, value) | Renvoie un tableau fusionné, un objet ou concatène une chaîne de caractères en fonction du type de données de base. | {"{{ functions.merge(['auth0', 'identity'], ['authentication']) }}"} // \['auth0', 'identity', 'authentication'] |
| md5(value) | Renvoie une valeur hachée MD5. | {"{{ functions.md5('auth0') }}"} // 7bbb597... |
| sha1(value) | Renvoie une valeur hachée SHA1. | {"{{ functions.sha1('auth0') }}"} // b4ec5339... |
| sha256(value) | Renvoie une valeur hachée SHA256. | {"{{ functions.sha256('auth0') }}"} // d9082bdc... |
| sha512(value) | Renvoie une valeur hachée SHA512. | {"{{ functions.sha512('auth0') }}"} // c0d588069d... |
| uuid() | Renvoie un UUID v4 aléatoire | {"{{ functions.uuid() }}"} // 36b8f84d-df4e-4d49-b662-bcde71a8764 |
## Meilleures pratiques pour les variables
### Utiliser des ID significatifs
Lorsque vous ajoutez un champ de Formulaire ou une action de Flux, l’ID est automatiquement généré.
Mettez à jour l’ID avec une valeur plus descriptive afin de pouvoir identifier les informations qu’il contient. Par exemple, si vous créez un champ de Formulaire qui stocke le prénom de l’utilisateur, modifiez l’ID en `first_name`.
### Soyez vigilant lorsque vous mettez à jour des ID existants
Si une variable est déjà utilisée et que vous devez modifier son ID, identifiez l’endroit où vous l’avez référencée et mettez l’ID à jour en conséquence pour éviter les valeurs indéfinies ou vides.
### Vérifier l’exécution des Flux
Si vous constatez une valeur de variable inattendue, utilisez l’aperçu [**Executions (Exécutions)**](/docs/fr-ca/customize/forms/flows/flow-execution-and-debugger) pour dépanner la variable.
### Utiliser le menu de remplissage automatique
Le menu de remplissage automatique vous aide à localiser et à référencer correctement les variables existantes.
