Übergeben von Konstruktionsparametern an Redux-Middleware

Question

Ich war neugierig, ob es einen Weg gibt, einen Parameter an eine Middleware zu übergeben, ohne sie aus dem Status zu holen. Ich möchte eine generische Funktion übergeben, die bestimmt, ob der Benutzer authentifiziert ist oder nicht. Anstatt also die Authentifizierungsinformationen aus dem Status, der eine Codeverdopplung sein soll, erneut zu erreichen, möchte ich die Funktion isAuthenticated an die Middleware weitergeben.

Ich glaube nicht, dass dies nativ in applyMiddleware Framework implementiert ist, aber vielleicht hat jemand eine Arbeit für diese Situation.

Answer 1

Ok der richtiger Weg, dies zu tun, stellt sich heraus, eine Wrapper-Funktion zu sein, dass die tatsächlichen Middleware-Funktion

export const middlewareFunction = (store) => (next) => (action) => { 
    do some stuff with something... 
} 

wickeln wird ist dies Ihre aktuelle Middleware-Funktion ist, als Sie die Middleware als

0 anwenden sollten

applyMiddleware(middlewareFunction); 

Was sollten Sie einen Parameter übergeben werden tun, ist eine Funktion wie

export const middlewareWrapper = (args) => { 
    do some stuff with your args 
    return (state) => (next) => (action) => { 
     do more stuff with your args and actions 
    } 
} 

Mit dieser Syntax implementieren Sie die Middleware als anwenden können:

applyMiddleware(middlewareFunction(args)); 

Answer 2

Da an Middleware übergebene Aktionen nicht rein sein müssen, können Sie eine Funktion als Teil der Aktion übergeben. Da die Middleware Zugriff auf den Speicher hat und store.getState() für den Status verwendet, können wir die Methode auf den Status anwenden und ein berechnetes Ergebnis erhalten.

In der api-Middleware aus den real world example of redux Sie, dass die endpoint eine Funktion sein kann sehen können, und der tatsächliche Endpunkt kann von Zustand (siehe den Code zwischen den Sternchen Kommentaren) berechnet werden:

export default store => next => action => { 
    const callAPI = action[CALL_API] 
    if (typeof callAPI === 'undefined') { 
    return next(action) 
    } 

    let { endpoint } = callAPI 
    const { schema, types } = callAPI 

/***************************************************************************/  
    /** if the endpoint is a function compute the actual endpoint from state ***/ 
    if (typeof endpoint === 'function') { 
    endpoint = endpoint(store.getState()) 
    } 
    /***************************************************************************/ 

    if (typeof endpoint !== 'string') { 
    throw new Error('Specify a string endpoint URL.') 
    } 
    if (!schema) { 
    throw new Error('Specify one of the exported Schemas.') 
    } 
    if (!Array.isArray(types) || types.length !== 3) { 
    throw new Error('Expected an array of three action types.') 
    } 
    if (!types.every(type => typeof type === 'string')) { 
    throw new Error('Expected action types to be strings.') 
    } 

    function actionWith(data) { 
    const finalAction = Object.assign({}, action, data) 
    delete finalAction[CALL_API] 
    return finalAction 
    } 

    const [ requestType, successType, failureType ] = types 
    next(actionWith({ type: requestType })) 

    return callApi(endpoint, schema).then(
    response => next(actionWith({ 
     response, 
     type: successType 
    })), 
    error => next(actionWith({ 
     type: failureType, 
     error: error.message || 'Something bad happened' 
    })) 
) 
} 

Answer 3

ich den richtigen Ansatz glauben ist wieder curry.

Datei, wo Sie die Middleware verwenden

import myMiddleWare from '/myMiddleWare.js' 
import { applyMiddleware } from 'redux' 

args = // whatever arguments you want  
applyMiddleware(myMiddleWare(args)) 

myMiddleWare.js

export default (args) => ({getState, dispatch}) => (next) => (action) => (
    // Use args do your hearts content 
)