2016-08-30 1 views
6

Ich versuche, über Middleware für Versprechungen durch die reagieren redux docs aber nicht verstehen, die then Teil unten zu lernen:Wie reagiert redux versprechen Middleware die resultierende Aktion an den Versand senden?

const vanillaPromise = store => next => action => { 
    if (typeof action.then !== 'function') { 
    return next(action) 
    } 

    return Promise.resolve(action).then(store.dispatch) 
} 

Wie funktioniert die then wissen, was zu versenden? Die Aktion wurde nicht als Argument wie

return Promise.resolve(action).then(function (action) {store.dispatch(action}) 

übergeben, so verstehe ich nicht, wie Dispatch die Aktion erhält.

Antwort

4

Ich hoffe, ich kann mit dieser Erklärung helfen.

können schauen, was Sie sind vertraut mit:

return Promise.resolve(action) 
    .then(function (action) { store.dispatch(action)}) 

Sie sehen diesen Teil:

function (action) { store.dispatch(action)} 

, die nur eine Funktion ist, wartet die „Aktion“ Eigentum übergeben werden.

Nun, wenn wir schauen, was Sie Fragen Wickeln Sie Ihr Gehirn um haben, ist dies:

return Promise.resolve(action) 
    .then(store.dispatch) // <--- this part 

die „Versand“ ist nur eine Funktion, und es wird erwartet, in diesem Fall ein Argument. Wahrscheinlich ist es ein Ziel - etwa so:

store.dispatch({ type: 'MY_ACTION_TYPE' })} 

jetzt, man "könnte" wickeln Sie es in einem Verschluss, wie so, und es wird Ihnen bekannt vorkommen:

.then((action) => { 
    store.dispatch(action) 
}) 

aber tun wir wirklich brauchen um es in einer anonymen Funktion zu "wickeln"? Nicht wirklich, also können wir einfach setzen: store.dispatch, und es ist die Funktion "Warten", um das Argument von der Rückgabe des Versprechens zu übergeben. denken Sie daran, wie folgt aus:

wenn wir die Funktion "MultipleByTwo" untersuchen - hat das vertraute Unterschrift Sie wissen über: (x) => x * 2

Wenn wir entfernen Sie einfach den Namen der Funktion, ist es das gleiche:

Promise.resolve(5).then((x) => x * 2) 

Hinweis: Sie sehen, dass resolve (5) -> denken Sie an diesem resolve.then als Kette oder eine „Übergabe“. Wenn wir "(5) auflösen", übergeben wir diesen Wert "5" weiter in "dann". Denken Sie daran, dass der Wert 5 alles Mögliche sein kann ... ein Primitiv, 5 in diesem Fall, ein Objekt {TYPE: "WHATEVER"}, eine Funktion, etc .. Es reicht nur aus .. Wie, "Hey '.then', hier ist mein Wert ....“

resolve(5).then(myfunction) 
     |    ^
     |__>__>__>__>__>_| 

Es ist wichtig zu verstehen, dass‚myFunction‘ist dieses Beispiel oben oder in unserem multiplyByTwo oder sogar, dass store.dispatch Beispiel .. sie alle ein vorübergehendes Argumente erwarten (s).

multiplyByTwo(x) <-- expecting one argument 

oder Ihre Funktion könnte es nicht innerhalb der Funktion Unterschrift erklären, aber es wird in den Körper, ala ..

myFunction() { 
    const args = Array.from(arguments) // we grab the arguments 
} 

oder für eine beliebige Anzahl von Argumenten der Hoffnung

myOtherFunction(...args) 

Aber ja - diese Funktionen eine Eingabe von der Auflösung zu handeln erwarten. Es kann Fälle geben, in denen Sie sich nicht um den zurückgegebenen Wert kümmern, falls vorhanden, Sie möchten nur eine Flusskontrolle haben ... tun Sie das, "THEN", dass ..

Ich hoffe, dass das hilfreich war und ich hoffe ich hat deine Frage beantwortet. Wenn nicht, lass es mich wissen.

+0

danke, ich kann sehen, dass es die Schließung nicht benötigt, um zu arbeiten. aber basierend auf was funktioniert das? Was ist die JavaScript-Regel, die besagt, dass ein bestimmtes Argument übergeben wird, ohne als Parameter deklariert zu werden? Ist das etwas, was dann passiert? Es nimmt magisch den aufgelösten Wert des Objekts an, das es aufgerufen hat, und fügt es in seinen Callback ein? – stackjlei

+0

Ja, lass mich meine Antwort aktualisieren und erklären, wie ".then" funktioniert. –

Verwandte Themen