Link
Links werden verwendet, um die Nutzer/innen von einer Seite zur nächsten zu navigieren. Außerdem dienen sie für Aktionen, die mehr Subtilität erfordern als eine Schaltfläche bietet.
So fügen Sie Ihrer App die Link
Komponente hinzu:
import {Link} from '@stripe/ui-extension-sdk/ui';
Bei den Stripe-Produkten gibt es zwei Arten von Links: primäre und sekundäre.
<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 |
Primärer Link
Der Standardstil für Links ist der primäre Stil. Dieser sollte verwendet werden, wenn Links zu externen Ressourcen oder zu anderen Seiten innerhalb der Anwendung erstellt werden.
<Link href="https://www.stripe.com">Primary link</Link> <Link href="https://www.example.com" external>External primary link</Link>
Sekundärer Link
Verwenden Sie sekundäre Links in den folgenden Fällen:
- Wenn ein Link andernfalls mit einer anderen benachbarten wichtigen Schaltfläche oder einem Link in Konflikt geraten würde.
- Wenn eine Seite zahlreiche Elemente darstellt, die jeweils ein Link sind. Da eine Seite mit vielen primären Links überfordernd sein könnte, verwenden wir in solchen Fällen sekundäre Links.
- Bei der Verlinkung mit einem Objekt wie einem/einer Kund/in, einer Zahlung, einem Produkt usw. Überall dort, wo die Nutzeroberfläche auf diese Objekte verweist, sollten sie auch verlinkt sein. Verwenden Sie den sekundären Stil, um ein visuelles Durcheinander zu vermeiden, da zahlreiche Objekte auf einer Seite verlinkt sein können.
<Link type="secondary" href="https://www.stripe.com">Secondary link</Link>
Deaktivierte Links
<Link disabled href="https://www.stripe.com">Primary link</Link> <Link type="secondary" href="https://www.stripe.com" disabled>Secondary link</Link>
Links in neuen Registerkarten öffnen
<Link href="https://stripe.com" target="_blank"> Open link in new tab </Link>
Zulässige href-Werte
Das Attribut „href“ unterstützt relative URLs und http- oder https-URLs. Andere Werte werden zur Laufzeit bereinigt.