Base UI: Autocomplete-Komponente für React

LinkSammlung

Die Dokumentation zu @base-ui/react stellt die Autocomplete-Komponente vor. Sie bietet Eingabevorschläge während der Texteingabe, unterstützt asynchrone Suchen und grenzt sich gezielt von klassischen Combobox-Elementen ab.

Das Wichtigste

  1. Erlaubt Freitext-Eingaben mit optionalen Vervollständigungsvorschlägen, im Unterschied zur strikten Combobox-Auswahl.
  2. Bietet eine modulare Anatomie inklusive Root, Input, Popup, List, Item, Empty, Status und Positioner.
  3. Unterstützt asynchrones Nachladen von Daten inklusive React Transitions und AbortController-Integration.
  4. Enthält Hilfs-Hooks wie useFilter und useFilteredItems zur flexiblen Filterlogik.
  5. Erfordert barrierefreie Beschriftungen über HTML-Labels oder Field-Komponenten.

Warum das relevant ist

Moderne Frontend-Anwendungen benötigen flexible, zugängliche Such- und Eingabefelder. Base UI liefert dafür ungestylte Primitiven mit klarer Trennung zwischen freier Texteingabe und fixer Werteauswahl.

Einordnung

Die Abgrenzung zwischen Autocomplete und Combobox wird in Designsystemen häufig vermischt. Base UI stellt klar: Autocomplete eignet sich für Freitext mit Vorschlägen oder filterbare Befehlspaletten, während Combobox zwingend einen bestehenden Eintrag bindet. Das gezeigte asynchrone Codebeispiel demonstriert zudem sauberes Abbrechen veralteter Netzwerk-Requests mit AbortController und sauberes State-Handling über React Transitions.

Erwähnte Links

Gefunden in

Zusammenfassung von KI erstellt (Gemini 3.8 Flash, 29. September 2026). Sie kann Fehler enthalten – maßgeblich ist die Originalquelle.

Ähnliche Einträge

Inhaltlich ähnlich, ermittelt über die KI-Suche.

Zurück zur Wissensbasis

Lassen Sie uns über Ihr Projekt sprechen

Kontakt aufnehmen

Standorte

  • Mattersburg
    Johann Nepomuk Bergerstraße 7/2/14
    7210 Mattersburg, Austria
  • Wien
    Ungargasse 64-66/3/404
    1030 Wien, Austria

Dieser Inhalt wurde teilweise mithilfe von KI erstellt.