Composants

Les composants sont les éléments de base d'une application PowerShell Universal.

Une application Universal est composée de composants. Lors de la création d'une application, vous pouvez simplement appeler les cmdlets PowerShell dans le script de votre application pour créer un nouveau composant.

New-UDApp -Title 'Dashboard' -Content {
    New-UDTypography -Text 'Hello, world!'
}

Types de composants

Il existe plus de 50 composants que vous pouvez utiliser dans vos applications. Parmi les composants couramment utilisés, on trouve :

• Affichage de données

  • Alertes
  • Tableaux
  • Chronologie
• Visualisation de données

  • Graphiques
  • Cartes
• Retour d'information

  • Modal
  • Progression
• Entrées

  • Bouton
  • Formulaire
  • Zone de texte
  • Interrupteur
• Navigation

  • Menu
  • Stepper
  • Onglets
• Mise en page

  • Grille
  • Pile
• Utilitaires

  • Dynamique
  • Élément
  • HTML
• Surfaces

  • Carte
  • Panneau extensible

Gestionnaires d'événements

De nombreux composants fournissent des gestionnaires d'événements pour offrir des fonctionnalités interactives. Il peut s'agir d'événements tels que des clics, des validations, des rendus et bien plus encore. L'interactivité d'un gestionnaire d'événements est implémentée à l'aide de blocs de script PowerShell.

Par exemple, l'exemple ci-dessous crée un bouton sur lequel on peut cliquer pour afficher une notification toast.

New-UDButton -Text "Click me!" -OnClick {
    Show-UDToast -Message "Clicked!"
}

Dans les gestionnaires d'événements, vous pouvez exécuter n'importe quel script PowerShell valide. Cela signifie que vous pouvez interagir avec des cmdlets extérieures au module PSU, comme ActiveDirectory ou Microsoft.Graph.

Données d'événement

Chaque gestionnaire d'événements peut fournir ses propres données d'événement. Les composants tels que les tableaux, les formulaires et les zones de texte renvoient les données correspondantes sur l'état du composant. Il peut s'agir des données actuelles d'une ligne du tableau, des valeurs d'un formulaire ou du texte d'une zone de texte.

Vous pouvez accéder aux données d'événement à l'aide de la variable $EventData. Cette variable sera différente selon le type de composant que vous utilisez. Par exemple, l'événement -OnChange de New-UDTextbox renvoie une chaîne dans $EventData.

New-UDTextbox -OnChange {
    Show-UDToast -Message $EventData
}

Ce sera différent pour d'autres contrôles. Par exemple, un formulaire renverra un objet contenant des propriétés sur l'état du formulaire.

New-UDForm -Content {
    New-UDTextbox -Id "UserName"
} -OnSubmit {
    Show-UDToast -Message $EventData.UserName
}

Vous pouvez également accéder à la chaîne brute fournie au gestionnaire d'événements à l'aide de la variable $Body. Celle-ci contient une chaîne JSON qui définit $EventData.

En plus de la variable $EventData, vous pouvez également utiliser la variable $PSUItem pour obtenir plus d'informations dans certains contrôles qui acceptent plusieurs types de données. Vous trouverez le type de données PSUItem ci-dessous.

public class PsuItem
{
    public string Id { get; set; }
    public string Type { get; set; }
    public string EventId { get; set; }
    public string EventName { get; set; }
    public string EventData { get; set; }
    public string Location { get; set; }
}

Portée

Comprendre la portée des gestionnaires d'événements est essentiel pour s'assurer que vos applications se comportent comme prévu. PowerShell Universal s'efforce de fournir efficacement toutes les variables dans la portée aux gestionnaires d'événements.

Par exemple, l'exemple ci-dessous constitue une utilisation naturelle d'une variable dans un script PowerShell standard et fonctionne également dans les gestionnaires d'événements.

$Variable = 123
New-UDButton -Text "Click Me" -OnClick {
    Show-UDToast -Message $Variable
}

L'utilisation des portées $Global: et $Script: ne fonctionnera pas comme prévu, car chaque gestionnaire d'événements fonctionne dans son propre runspace. PSU déplace manuellement les variables lors du traitement, mais ne modifie pas les variables dans d'autres portées.

Vous devriez utiliser des portées personnalisées pour accéder aux variables entre les gestionnaires d'événements.

De plus, vous devriez éviter d'essayer d'hériter de $EventData dans des gestionnaires d'événements imbriqués. Bien que certains composants ne définissent pas leurs propres données d'événement, il faut supposer que les données d'événement seront écrasées dans le composant imbriqué.

New-UDTable -Columns @(
    New-UDTableColumn -Property 'Name' -OnRender {
        New-UDButton -Text $EventData.Name -OnClick {
            # $EventData has been replaced by the button and no longer has a name property
            Show-UDToast -Message $EventData.Name
        }
    }
) -Data $Data

Pour éviter ce problème, vous devriez stocker les données dans une autre variable à transmettre dans la portée du gestionnaire d'événements du composant imbriqué.

New-UDTable -Columns @(
    New-UDTableColumn -Property 'Name' -OnRender {
        $Name = $EventData.Name
        New-UDButton -Text $EventData.Name -OnClick {
            Show-UDToast -Message $Name
        }
    }
) -Data $Data