# Parameters ou props ?

Choisissez où stocker le contenu du modèle et où fournir les données pour chaque document.

Vous verrez à la fois **Props** et **Parameters** lors de la modification d'un modèle. Les deux fournissent des valeurs au contenu, mais ils servent des objectifs différents : l'un stocke les valeurs qui appartiennent au modèle, tandis que l'autre reçoit des données pour chaque document.

Les garder séparés vous permet de modifier la conception en un seul endroit et de la réutiliser avec différentes données, sans rouvrir l'éditeur à chaque exécution.

## 1. Choisissez où appartient une valeur

Utilisez **Props** pour les valeurs enregistrées avec le modèle, telles que les titres, les étiquettes, les couleurs et les logos. Utilisez **Parameters** pour les données fournies par exécution, telles qu'un destinataire, un numéro de référence ou une liste d'éléments.

| Valeur | À sa place |
| --- | --- |
| Une étiquette « Destinataire » | Un accessoire sur la section l'affichant. |
| Le nom du destinataire | Un paramètre. |
| Une couleur ou un logo partagé | Un accessoire Global. |
| Une liste d'éléments | Un paramètre de tableau. |
| Une étiquette avec versions anglais/vietnamien | Un accessoire avec des valeurs spécifiques aux variantes. |

<figure class="doc-sim data-assets-illustration" aria-label="Props sont enregistrés avec le modèle · Parameters reçoit des données pour chaque exécution">
<div class="sim-stage"><div class="ds-columns"><div class="sim-panel"><div class="ds-head"><strong>Props</strong></div><div class="sim-prop-card ds-field"><div class="sim-prop-name"><b>rubrique</b><span class="ds-type">Texte <svg class="sim-chevron" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" aria-hidden="true"><path d="m4 6 4 4 4-4" /></svg></span></div><div class="sim-prop-value"><small class="sim-label">VALEUR</small><span class="sim-input sim-focus">Titre du document</span><span class="sim-embed">{{ props.heading }}</span></div></div></div><div class="sim-panel"><div class="ds-head"><strong>Parameters</strong></div><div class="sim-prop-card ds-field"><div class="sim-prop-name"><b>destinataire</b><span class="ds-type">Texte <svg class="sim-chevron" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" aria-hidden="true"><path d="m4 6 4 4 4-4" /></svg></span></div><div class="sim-prop-value"><small class="sim-label">PAR DÉFAUT</small><span class="sim-input">Tembuilder</span><span class="sim-embed">{{ params.recipient }}</span></div></div></div></div></div>
<figcaption>Props sont enregistrés avec le modèle · Parameters reçoit des données pour chaque exécution</figcaption>
</figure>

## 2. Props appartient à la pièce que vous éditez

Sélectionnez une section, un en-tête ou un pied de page dans **Structure**, puis ouvrez **Props**. Sélectionnez **Ajouter un accessoire** pour ajouter une valeur. Les types disponibles incluent Texte, Nombre, Booléen, Tableau, Objet, Couleur et Actif.

Dans le HTML de cette partie, lisez l'accessoire avec `{{ props.heading }}`. Pour un accessoire Global partagé, utilisez `{{ global.props.propName }}`.

Différentes sections peuvent avoir props avec le même nom. Vérifiez le nom de la section au-dessus de la liste Props pour voir quelle partie vous modifiez.

<figure class="doc-sim data-assets-illustration" aria-label="Sélectionnez une section pour éditer son Props">
<div class="sim-stage"><div class="ds-path">Structure → Section → Props</div><div class="sim-panel"><div class="ds-head"><strong>Rubrique</strong><span class="sim-control">＋ Ajouter un accessoire</span></div><div class="sim-prop-card ds-field"><div class="sim-prop-name"><b>rubrique</b><span class="ds-type">Texte <svg class="sim-chevron" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" aria-hidden="true"><path d="m4 6 4 4 4-4" /></svg></span></div><div class="sim-prop-value"><small class="sim-label">VALEUR</small><span class="sim-input sim-focus">Titre du document</span><span class="sim-embed">{{ props.heading }}</span></div></div></div></div>
<figcaption>Sélectionnez une section pour éditer son Props</figcaption>
</figure>

## 3. Parameters fournit des données pour chaque exécution

Ouvrez **Parameters → Schema** pour déclarer les noms de champs, les types et les valeurs par défaut. Utilisez `{{ params.recipient }}` dans HTML pour lire le champ `recipient`.

Inspectez l'objet de données dans **Payload**, puis utilisez cette structure lors de la saisie des données dans **Run**. La fourniture d'une nouvelle valeur modifie les données de l'exécution, et non le props enregistré dans le modèle.

Voir [Déclarer les données d'entrée](/docs/fr/data/parameters/) pour ajouter des champs à un modèle.

<figure class="doc-sim data-assets-illustration" aria-label="Parameters → destinataire → params.recipient">
<div class="sim-stage"><div class="sim-panel"><div class="ds-head"><strong>Parameters</strong><span class="sim-control">＋ Ajouter</span></div><div class="sim-tabs"><span class="sim-active">Schema</span><span>Payload</span></div><div class="sim-prop-card ds-field"><div class="sim-prop-name"><b>destinataire</b><span class="ds-type">Texte <svg class="sim-chevron" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" aria-hidden="true"><path d="m4 6 4 4 4-4" /></svg></span></div><div class="sim-prop-value"><small class="sim-label">PAR DÉFAUT</small><span class="sim-input sim-focus">Tembuilder</span><span class="sim-embed">{{ params.recipient }}</span></div></div></div><div class="ds-link-arrow">↓</div><div class="ds-code"><code>{ "recipient": "Tembuilder" }</code></div></div>
<figcaption>Parameters → destinataire → params.recipient</figcaption>
</figure>

## 4. Combinez-les dans HTML

Par exemple, `heading` stocke un en-tête de section comme accessoire, tandis que `recipient` reçoit le nom du lecteur comme paramètre :

```handlebars
<h1>{{ props.heading }}</h1>
<p>{{ params.recipient }}</p>
```

Modifiez `heading` dans Props pour modifier l'en-tête du modèle. Fournissez un autre `recipient` pour réutiliser le design pour une autre personne.

Pour plusieurs jeux d'étiquettes ou de couleurs dans un seul modèle, voir [Variantes de modèle](/docs/fr/data/variants/).

<figure class="doc-sim data-assets-illustration" aria-label="Le texte du modèle et les données d'entrée apparaissent ensemble dans le document">
<div class="sim-stage"><div class="ds-flow"><div class="ds-code sim-focus"><code>&lt;h1&gt;{{ props.heading }}&lt;/h1&gt;</code><code>&lt;p&gt;{{ params.recipient }}&lt;/p&gt;</code></div><span class="ds-flow-arrow">→</span><div class="ds-paper"><small>Tembuilder</small><strong>Titre du document</strong><div><p>Tembuilder</p></div><div class="ds-lines"><i></i><i></i><i></i></div></div></div></div>
<figcaption>Le texte du modèle et les données d'entrée apparaissent ensemble dans le document</figcaption>
</figure>

Consultez la [référence de syntaxe Handlebars](/docs/fr/data/handlebars/) pour les conditions, la portée, les échappements et les exemples avancés.
