Partager via

Composants de code

  • Article

Les composants de code sont un type de composant de solution, ce qui signifie qu’ils peuvent être intégrés à un fichier de solution et importés dans différents environnements. Découvrez comment mettre en package et distribuer des extensions à l’aide des solutions.

Composants de code.

Vous pouvez inclure des composants de code dans une solution, puis importer la solution dans un environnement Microsoft Dataverse. Une fois la solution contenant des composants de code importée, les administrateurs système et les personnalisateurs de système peuvent configurer des colonnes, des sous-grilles, des vues et des sous-grilles de tableau de bord à utiliser à la place des composants par défaut. Vous pouvez ajouter ces composants de code aux applications pilotées par modèle et canevas.

Les composants de code sont composés de trois éléments :

Notes

La définition et l’implémentation de composants de code à l’aide de Power Apps component framework est la même pour les applications pilotées par modèle et canevas. La seule différence entre les deux est la partie configuration.

Manifeste

Manifeste est le fichier de métadonnées ControlManifest.Input.xml qui définit un composant. Il s’agit d’un document XML qui décrit :

  • Nom du composant.
  • Le type de données qui peut être configuré, un field ou un dataset.
  • Toutes propriétés qui peuvent être configurées dans l’application lorsque le composant est ajouté.
  • Une liste des fichiers de ressources dont le composant a besoin.

Lorsqu’un utilisateur configure un composant de code, les données du fichier manifeste filtrent les composants disponibles afin que seuls les composants valides pour le contexte soient disponibles pour la configuration. Les propriétés définies dans le fichier manifeste pour un composant sont affichées sous forme de colonnes de configuration afin que la personne configurant le composant puisse spécifier des valeurs. Ces valeurs de propriété sont ensuite disponibles pour le composant au moment de l’exécution. Informations complémentaires : Référence du schéma de manifeste

Implémentation de composant

Les composants de code sont implémentés à l’aide de TypeScript. Chaque composant de code doit inclure un objet qui implémente les méthodes décrites dans l’interface du composant de code. La CLI Power Platform générera automatiquement un fichier index.ts qui inclut les implémentations de stub pour ces méthodes. Ce fichier est généré automatiquement à l’aide de la commande pac pcf init avec les principales méthodes de stub.

L’objet implémente les méthodes suivantes :

Ces méthodes contrôlent le cycle de vie du composant de code.

Chargement de la page

Lorsque la page se charge, l’application requiert un objet à utiliser. Avec les données du fichier manifeste, le code obtient l’objet en appelant :

var obj =  new <"namespace on manifest">.<"constructor on manifest">();

Si les valeurs de l’espace de noms et du constructeur du manifeste étaient SampleNameSpace et LinearInputComponent respectivement, le code pour instancier l’objet serait :

var controlObj = new SampleNameSpace.LinearInputComponent();

Lorsque la page est prête, elle initie le composant en appelant la méthode init avec un jeu de paramètres.

controlObj.init(context,notifyOutputChanged,state,container);
Paramètre Description
contexte Contient toutes les informations sur la façon dont le composant est configuré et tous les paramètres qui peuvent être utilisés dans le composant avec les API Power Apps component framework. Par exemple, context.parameters.<"property name from manifest"> peut être utilisé pour accéder à la propriété d’entrée.
notifyOutputChanged Avertit l’infrastructure lorsque le composant de code comporte de nouvelles sorties prêtes à être récupérées de manière asynchrone.
state Contient les données de composant du chargement de page précédent de la session active si le composant les a stockées explicitement précédemment à l’aide de la méthode setControlState.
container Élément de division HTML auquel les développeurs et les créateurs d’application peuvent ajouter les éléments HTML pour l’interface utilisateur qui définit le composant.

Modifications des données par l’utilisateur

Lorsqu’un utilisateur interagit avec vos composants pour modifier des données, votre composant doit appeler la méthode transmise en tant que paramètre notifyOutputChanged dans la méthode init. Lorsque vous utilisez cette méthode, la plateforme répond ensuite en appelant la méthode getOutputs. La méthode getOutputs renvoie les valeurs qui ont été modifiées par l’utilisateur. Pour un composant field, il s’agit généralement de la nouvelle valeur du composant.

Modifications des données par l’application

Si les données sont modifiées par la plateforme, celle-ci appelle la méthode updateView du composant et transmet un nouvel objet de contexte en tant que paramètre. Cette méthode doit être mise en œuvre pour mettre à jour les valeurs affichées dans le composant.

Fermeture de page

Lorsque l’utilisateur quitte la page, le composant de code perd l’étendue et généralement toute la mémoire attribuée dans cette page pour les objets de votre composant sera effacée. Toutefois, certaines méthodes basées sur le mécanisme d’implémentation du navigateur peuvent rester et consommer de la mémoire. En règle générale, ce sont les gestionnaires d’événements. Si l’utilisateur souhaite stocker ces informations, il doit appliquer la méthode setControlState afin que les informations soient fournies la prochaine fois dans la même session.

Les développeurs doivent appliquer la méthode détruire, qui est appelée à la fermeture de la page, pour supprimer tout code de nettoyage, comme les gestionnaires d’événements.

Resources

Le nœud de ressource dans le fichier manifeste fait référence aux ressources que le composant nécessite pour implémenter son affichage. Chaque composant de code doit contenir un fichier de ressources pour construire un affichage. Le fichier index.ts généré par les outils est une ressource code. Il doit y avoir au moins une ressource code.

Vous pouvez définir des fichiers de ressources supplémentaires dans le manifeste pour inclure :

  • CSS fichiers
  • ressources web d’images
  • ressources web resx pour la localisation

Plus d’informations : Élément de ressources.

Créer un composant de code

Notes

Pouvez-vous nous indiquer vos préférences de langue pour la documentation ? Répondez à un court questionnaire. (veuillez noter que ce questionnaire est en anglais)

Le questionnaire vous prendra environ sept minutes. Aucune donnée personnelle n’est collectée (déclaration de confidentialité).