Gibt es eine Möglichkeit, die Optionen eines React-Input-Dropdown-Menüs zu formatieren?Formatierung Optionen für die Auswahl der React-Auswahl
Zum Beispiel möchte ich eine Autocomplete Dropdown haben, die die Optionen in einer formatierten Weise mit Spalten anzeigt. Fast wie ein Drop-Down-Datenraster, so dass der Benutzer "Name", "Adresse" usw. einheitlich sehen kann.
React rendert alles, was Sie möchten, in das DOM mit den von Ihnen ausgewählten Klassen oder Stilen. Das Design-Problem zu lösen wäre nicht anders, als wenn Sie nur mit HTML und CSS arbeiten würden.
Der React-Teil der Gleichung wird Interaktionen handhaben und sicherstellen, dass die richtigen Klassen/Stile auf den richtigen Komponenten landen. Sie können auch immer einfach in die Verwendung einer Drittanbieter-Bibliothek eingebaut reagieren wie http://jedwatson.github.io/react-select/
Ich verwende derzeit react-select. Wie auch immer, ich weiß nicht, wie man die Zeilen so formatiert, dass man einen bestimmten Platz für Name, Datum usw. bekommt. –
mit react-select kann man zwei Requisiten übergeben: 'optionClassName' und' className'. Sie können eine beliebige Zeichenfolge an "optionClassName" übergeben und sie fügt dies als Klasse zu jeder Optionszeile hinzu, und "className" macht dasselbe, außer dass sie die Klasse zum Container hinzufügt. Um die Kontrolle zu haben, könnten Sie etwas wie 'className = 'my-custom-select' und 'optionClassName = my-custom-select-option' machen. Dann benutze einfach css, um das Padding und die Ränder anzupassen. – finalfreq
@finalfreq Das ist nicht das, was er zu erreichen versucht. –