Wie sollte ich in Redux folgenden Logik implementieren: Es gibt 2 Aktionen: sync und async. Sagen wir mal validate() und save(). Wenn der Benutzer auf die Schaltflächen validate()
klickt, wird die Variable isValid
im Statusspeicher geändert. Dann wenn isValid
speichern Aktion durchgeführt.Redux Aufruf Aktion nach anderen Aktionen, wenn Bedingung
Antwort
Sie können diese Funktionen in "Click-Handler" umbrechen.
Ich denke, Validierungslogik sollte in Reducer sein, aber nicht nur in Clicnk Hadler. Der Punkt ist, es in "Redux-Weise" zu implementieren. – xander27
Ich meine Redux-Aktionen (http://redux.js.org/docs/basics/Actions.html) nicht nur JS-Methoden – xander27
Ich glaube nicht, Reduzierer ist ein guter Ort dafür. Was mich betrifft, bevorzuge ich es, den Reducer von solchen Dingen sauber zu halten und sie nur zum Ändern des Zustandes der Komponenten zu verwenden. Sie können etwas wie utils-Datei erstellen und dort alle diese Funktionen behalten. Aber wenn du das nicht magst, würde ich dir empfehlen, sich redux thunk anzuschauen, damit du Funktionen in Action-Creators zurückgeben kannst, du kannst dort deine Logik angeben. – Spooner
Es gibt viele Möglichkeiten, das zu tun, was Sie möchten. In der Regel sollten Sie jedoch nichts in Redux speichern, das abgeleitet werden kann. isValid
kann abgeleitet werden, indem Sie Ihre Validierung für Ihre Felder ausführen. Darüber hinaus glaube ich nicht, dass Zwischenzustände wie sich ändernde Formfeldwerte in Redux gehören. Ich würde sie im Status "React" speichern, bis sie als gültig und übermittelt gelten.
Mit dem aus dem Weg, wie Spooner in einem Kommentar erwähnt, können Sie eine Synchronisierung Aktion innerhalb eines Thunk aufrufen. Oder Sie können innerhalb des Thunk auf den Status zugreifen.
Option # 1
// Action Creator
export default function doSomething(isValid) {
return (dispatch) => {
dispatch(setValid(isValid));
if (isValid) {
return fetch() //... dispatch on success or failure
}
};
}
Option # 2
// Component
dispatch(setValid(isValid));
dispatch(doSomething());
// Action Creator
export default function doSomething() {
return (dispatch, getState) => {
const isValid = getState().isValid;
if (isValid) {
return fetch() //... dispatch on success or failure
}
};
}
Sie sollten saveAction durchführen, wenn Validate geschieht, und verwenden, die beide isValid Variable und andere Variablen in Reduzierungen zu ändern. Keine wirkliche Verwendung beim Warten auf isValid-Variable auf wahr gesetzt werden. –
@bhargavponnapalli das Problem ist zweite Aktion ist async (react-thunk), so kann es nicht nur mit dem ersten kombiniert werden. – xander27
Sie können möglicherweise innerhalb der asynchronen Aktion validieren, anstatt eine separate Validierungsaktion. Nur eine Idee. –