SmartLink Demo

SmartLink

Ein echtes <a href>-Tag das optional wie ein Button aussieht – mit automatischer Active-Klasse, Enhanced Navigation Control und vollem Browser-Verhalten (Mittelklick, Ctrl+Klick, Rechtsklick).

Active-Match Varianten bei SmartLink

Zeigt welche Strategie wann greift. Navigiere zu verschiedenen URLs um den Effekt zu sehen.

Exact: /demo Prefix: /demo SegmentPrefix: /demo/smartlink Regex: ^demo/smartlink UseActive=false (nie aktiv)

AsButton – Semantikfarben

Der Link rendert ein echtes <a href> – verhält sich im Browser wie ein Link, sieht aus wie ein Button.

Neutral Primary Secondary Danger Success Warning Info

AsButton – Outline & Ghost

Neutral Outline Primary Outline Danger Outline

Neutral Ghost Primary Ghost Danger Ghost

Mit Icon

Öffnen Bearbeiten Löschen

Größen & Radius (AsButton)

XS SM MD (default) LG XL

Radius None Radius SM Radius LG Radius Full

Shadow (gedrückter Zustand)

Ohne Shadow Mit Shadow

ForceLoad – echter Browser-Reload

ForceLoad="true" setzt onclick="window.location.assign(this.href)" und umgeht damit Blazors SignalR-Interception. Linksklick = echter Reload. Mittelklick / Ctrl+Click = neues Tab (onclick wird dabei nicht gefeuert).

Seite initialisiert um: 13:25:26.187 (ändert sich nur bei ForceLoad=true)

ForceLoad=false (Standard – kein Reload) ForceLoad=true (echter Browser-Reload)

ChildContent (Custom Markup)

Custom Inhalt Neu

Vergleich: Plain <a> vs. NavLink vs. SmartLink

Alle drei Links zeigen auf /demo/smartlink (aktuelle Seite) – nur SmartLink und NavLink setzen die Active-Klasse automatisch.

Plain <a>
Kein Active, kein Enhanced Nav

Plain Link /demo/smartlink

NavLink (Blazor) (Inactive)
Setzt „active"-Klasse nicht, kein href-Fallback für Rechtsklick-Ziel

NavLink /demo/foobar

NavLink (Blazor) (Active)
Setzt „active"-Klasse, kein href-Fallback für Rechtsklick-Ziel

NavLink /demo/smartlink