reagieren: wie Fokus von einem Klick-Handler

setzen

Mein Reaktiv-Redux-basiertes Formular hat eine Schaltfläche, die das Formular zurücksetzen sollte und Fokus zurück in das erste Eingabefeld verschieben.
Zurücksetzen des Inhalts ist gerade redux Zustand, aber ich habe Probleme mit dem Fokus.reagieren: wie Fokus von einem Klick-Handler

AutoFokus auf das erste Feld funktioniert nur beim ersten Rendern. Gibt es eine vernünftige Möglichkeit, es erneut auszulösen?

Wenn ich mit expliziten element.focus() gehen muss, wo soll ich es nennen? Ich verwende Reaktiv-Redux, aber nicht Redux-Formen.

Quelle

2016-04-12 Joachim Lous

Behalten Sie einige Informationen im Speicher, um zu wissen, welches Element beim Laden der Seite berücksichtigt werden sollte? Nee? Warum solltest du das später machen?

Trigger element.focus() direkt nach dem Versand Aktion - Sie benötigen weder Redux, noch Redux diesen Zustand zu speichern.

Pseudocode wie dies

onReset() { 
    const action = { 
    type: RESET_FORM, 
    } 
    dispatch(action); 

    const element = getElement(); // propably read ref? Find element with [autoFocus] attribute in component? 
    element.focus(); 
}

Quelle

2016-04-12 13:56:01 Andreyco

Mein ursprünglicher mo Tivation war es, die View-Klassen auf reinen, dummen Rendering-Code zu beschränken, der frei von Verhaltens-/Zustandsänderungs-Code ist und in der Lage ist, alle Status-Logik unabhängig vom Rendering zu testen. Der Unterschied zur Standard-Fokusbehandlung (die meinen Anwendungsstatus nicht durchläuft) besteht darin, dass sie jetzt explizit von meinem Code manipuliert wird. Aber Sie mögen Recht haben, dass ein pragmatischerer Ansatz für dieses spezielle Problem am besten ist, und es ist nicht realistisch oder wünschenswert, alle Fokussteuerung auf App-Code zu verschieben. –

aussehen könnten

Sie verwenden können:

document.getElementById("ElementName").focus();

endgültiger Code hier:

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
<meta charset="UTF-8"> 
 

 
<script> 
 
function change() { 
 
    document.getElementById("two").focus(); 
 
} 
 
</script> 
 
</head> 
 

 

 

 
<body> 
 
    <input type="radio" name="name" id="name" onchange="change()" /> 
 

 
    <input type="text" name="one" id="one" /> 
 
    <input type="text" name="two" id="two" /> 
 
</body> 
 
</html>

Quelle

2016-04-12 14:05:25 aghilpro

Wie in der Frage angegeben, weiß ich über element.focus(). Mein Interesse war, wo (oder ob) es in die react/redux-Art, Dinge zu tun, passt. Der Aufruf von einem input.onChange ist definitiv falsch für die beschriebene Herausforderung. –

okay. Ich hab es geschafft. – aghilpro

reagieren: wie Fokus von einem Klick-Handler

Antwort

Verwandte Themen