Lien
Les liens permettent de rediriger les utilisateurs d'une page à une autre, ainsi que pour les actions plus complexes pour lesquelles l'utilisation d'un bouton n'est pas envisageable.
Pour ajouter le composant Link
à votre application :
import {Link} from '@stripe/ui-extension-sdk/ui';
Les produits Stripe proposent deux types de liens : les liens primaires et les liens secondaires.
<Link href="https://www.stripe.com">Primary link</Link> <Link type="secondary" href="https://www.stripe.com">Secondary link</Link>
Props
Prop | Type | Description |
---|---|---|
className |
| The css class name |
disabled |
| Whether the action is disabled. |
external |
| Whether linking out to an external resource |
href |
| Native `href` attribute |
onPress |
| Handler that is called when the press is released over the target. |
rel |
| |
tabIndex |
| |
target |
| The anchor target |
type |
| The type of the link |
Lien primaire
Le style primaire est le style par défaut pour les liens. Utilisez-le lorsque vous créez des liens menant vers des ressources externes ou vers d’autres pages de l’application.
<Link href="https://www.stripe.com">Primary link</Link> <Link href="https://www.example.com" external>External primary link</Link>
Lien secondaire
Utilisez les liens secondaires dans les cas suivants :
- Lorsqu’un lien risque d’entrer en conflit avec un autre bouton ou lien primaire situé à proximité
- Lorsqu’un grand nombre d’éléments sont présentés à l’écran et que chacun d’entre eux comporte un lien, nous vous conseillons d’utiliser des liens secondaires afin d’éviter toute surcharge visuelle.
- Lorsque vous créez un lien vers un objet (Customer, Payment, Product, etc.), dès lors que l’interface utilisateur fait référence à ces objets, créez un lien permettant d’y accéder. Utilisez le style secondaire pour réduire l’encombrement visuel dû à la présence de nombreux objets sur une même page.
<Link type="secondary" href="https://www.stripe.com">Secondary link</Link>
Liens désactivés
<Link disabled href="https://www.stripe.com">Primary link</Link> <Link type="secondary" href="https://www.stripe.com" disabled>Secondary link</Link>
Ouverture de liens dans de nouveaux onglets
<Link href="https://stripe.com" target="_blank"> Open link in new tab </Link>
Valeurs href autorisées
L’attribut href prend en charge les URL relatives et http ou https. Les autres valeurs sont filtrées au moment de l’exécution.