Récupère tous les comptes et permet la sélection de comptes via la liste déroulante et la recherche. Pour capturer le compte actuellement sélectionné, vous pouvez utiliser l'écouteur onChange
.
Notez que la plateforme contient déjà son propre sélecteur de compte, qui se trouve dans l'en-tête de celle-ci. Celui-ci peut être configuré pour être affiché à l'aide de l'API nerdlet.setConfig
(en passant { accountPicker: true }
), et sa valeur peut être lue à l'aide de <PlatformStateContext.Consumer>
. Pour une référence complète, veuillez consulter ces API.
Usage
import { AccountPicker } from 'nr1'
Exemples
Basique
class Example extends React.Component { constructor() { super(...arguments);
this.state = { accountId: null };
this.onChangeAccount = this.onChangeAccount.bind(this); }
onChangeAccount(_, value) { alert(`Selected account: ${value}`);
this.setState({ accountId: value }); }
render() { return ( <AccountPicker value={this.state.accountId} onChange={this.onChangeAccount} /> ); }}
Avec étiquette en ligne
class Example extends React.Component { constructor() { super(...arguments);
this.state = { accountId: null };
this.onChangeAccount = this.onChangeAccount.bind(this); }
onChangeAccount(_, value) { alert(`Selected account: ${value}`);
this.setState({ accountId: value }); }
render() { return ( <AccountPicker label="Account" labelInline value={this.state.accountId} onChange={this.onChangeAccount} /> ); }}
Accessoires
chaîne | Fournissez une étiquette descriptive pour ce contrôle, par exemple "Comptes". |
chaîne | Ajoute les noms de classe au composant. Doit être utilisé uniquement à des fins de positionnement et d'espacement. |
booléen | Affiche une option en haut nommée « Tous les comptes ». Lorsqu'elle est sélectionnée, la valeur fournie par le rappel |
booléen | Si |
chaîne | Texte à afficher comme étiquette. |
booléen | Affichez l'étiquette en ligne dans le contrôle de formulaire. À utiliser uniquement lorsque le composant n'est pas à l'intérieur d'un |
fonction | Rappel déclenché à chaque fois que l'utilisateur clique sur un compte de la liste. function ( |
énumération[] | Propriété d'espacement. L'espacement est défini comme un uplet de zéro à quatre valeurs, qui suivent les mêmes conventions que les propriétés CSS comme <Array of |
objet | Style en ligne pour un style personnalisé. Doit être utilisé uniquement à des fins de positionnement et d'espacement. |
chaîne | Ajoute un attribut |
nombre|énumération | Identifiant du compte sélectionné. |