Material-ui: Wie kann programmgesteuert der Fokus () auf das Auswahlfeld ausgelöst werden?

Erstellt am 16. Nov. 2017  ·  3Kommentare  ·  Quelle: mui-org/material-ui


Meine App-Formulare verwenden die Eingabetaste, um auf einer Tastatur mit zehn Tasten auf bestimmte Felder zuzugreifen. Wenn die Eingabetaste gedrückt wird, führen wir eine DOM-Suche durch und lösen den Fokus () auf das nächste Element aus. Dies funktioniert gut in Textfeldern, aber ich kann nicht verstehen, wie dies in einem Auswahlfeld erreicht wird. Ich kann jedes der DOM-Elemente abrufen, aus denen die Select-Struktur besteht, aber das Auslösen von focus () auf jeder Ebene bewirkt nichts.
Hinweis: Ich kann die Referenz des Elements über inputRef auf der Auswahl abrufen, um zu verhindern, dass wir das DOM durchlaufen, aber es werden immer noch keine Ergebnisse angezeigt.
Vielen Dank im Voraus für jede Anleitung!

  • [x] Ich habe die Probleme dieses Repositorys durchsucht und glaube, dass dies kein Duplikat ist.

Erwartetes Verhalten


Die Auswahl wird fokussiert (aber nicht geöffnet), wenn der Fokus () manuell ausgelöst wird. Erwarten Sie das gleiche Verhalten wie beim Schlagenauf dem vorhergehenden Element.

Aktuelles Verhalten


Das Auslösen von node.focus () bewirkt nichts und löst auch kein Element in der ausgewählten DOM-Struktur aus.

Schritte zum Reproduzieren (für Fehler)


https://codesandbox.io/s/m43qqyo2zy

  1. Wählen Sie das erste Textfeld aus.
  2. Drücken Sie die Eingabetaste.
  3. Beachten Sie, dass das zweite Textfeld auf FTW ausgerichtet ist.
  4. Drücken Sie erneut die Eingabetaste.
  5. Nichts passiert.

Kontext

Ihre Umgebung

| Tech | Version |
| -------------- | --------- |
| Material-UI | 1.0.0-beta.21 |
| Reagiere | 16.1.0 |
| Browser | Chrome 62 |
| etc | |

question

Hilfreichster Kommentar

Falls hier jemand mit einem ähnlichen Problem stolpert: Dies funktioniert: https://stackoverflow.com/questions/47353384/how-to-programmatisch-trigger-focus-on-material-ui-select-field

Alle 3 Kommentare

@zachariahtimothy Ich bin nicht überzeugt, dass dies ein Problem mit MUI ist. Es sieht so aus, als ob Sie eine Formularbereinigung durchführen müssen. Fragen zur Verwendung der Bibliothek finden Sie unter Stapelüberlauf. Prost! 😄

@ m2mathew Ich sagst , ich werde die Frage zum Stapelüberlauf stellen.
Meiner Ansicht nach wäre es ein Problem mit der Bibliothek, wenn die Auswahl von MUI nicht als natives Formularelement in Bezug auf Ereignisse behandelt werden kann. Ich habe es mit der einheimischen Flagge versucht, die funktioniert hat, so dass ich durchkomme, hat einfach nicht die Schönheit, die ich mir wünsche, wie die überschriebene Auswahl :).
Vielen Dank für die Antwort und die tolle Bibliothek!

Falls hier jemand mit einem ähnlichen Problem stolpert: Dies funktioniert: https://stackoverflow.com/questions/47353384/how-to-programmatisch-trigger-focus-on-material-ui-select-field

War diese Seite hilfreich?
0 / 5 - 0 Bewertungen