Wie kann ich ein Versprechen von meinem ActionCreator Rückkehr in React Redux

Question

Ich habe die folgende Prozedur, die zwei Aktionen entsendet ...

_onPress =() => { 
    let { request,userId} = this.props; 
    this.props.dispatch(acceptRequest(request.id,userId)) 
    this.props.dispatch(navigatePop()); 
} 

Was ich dies wie stattdessen aussehen möchte, ist die folgende ...

_onPress =() => { 
    let { request,userId} = this.props; 
    this.props.dispatch(acceptRequest(request.id,userId)) 
     .then(this.props.dispatch(navigatePop())) 
} 

Mein ActionCreator so ...

export function acceptRequest(requestId,fulfilledBy){ 
    return dispatch => { 
    fulfillments.create(requestId,fulfilledBy) 
     .then(response => response.json()) 
     .then(fulfillment => { 
     dispatch(_acceptRequestSuccess(fulfillment)) 
     }) 
     .catch(err => { 
     console.log(err); 
     dispatch(_acceptRequestError(error)) 
     }) 
    } 
} 

ich bin mir bewusst, dass sie viel Middleware sieht (s) haben, die Leute schlagen vor, aber ich nicht sehen, wie irgendwelche von ihnen dieses Szenario passen, es sei denn, ich bin fertig, etwas zu tun falsch.

In meinem speziellen Fall möchte ich nur die zweite Aktion versenden, wenn die erste erfolgreich ist, aber ich möchte dies nicht vom Aktionsersteller tun, weil dann es weniger wiederverwendbar ist.

Answer 1

Ok, also habe ich dich missverstanden, du solltest erwähnen, dass du redux-thunk verwendest.

Ich glaube nicht Redux Aktion ein Versprechen zurückgeben sollte, glaube ich Ihnen alles, was in der Komponente tun sollen, und dann mit dem Versprechen, wie diese spielen:

_onPress =() => { 
    let { request,userId} = this.props; 

    fulfillments.create(requestId,fulfilledBy) 
     .then(response => response.json()) 
     .then(fulfillment => { 
      this.props.dispatch(_acceptRequestSuccess(fulfillment)) 
     }) 
     .then(() => { 
      this.props.dispatch(navigatePop()); 
     }) 
     .catch(err => { 
     console.log(err); 
     this.props.dispatch(_acceptRequestError(error)) 
     }) 
} 

Aber wenn Sie wollen immer noch zurückkehren Versprechen Sie können die Funktion innerhalb der Aktion das Versprechen zurückgeben:

export function acceptRequest(requestId,fulfilledBy){ 
    return dispatch => { 
    return fulfillments.create(requestId,fulfilledBy) 
     .then(response => response.json()) 
     .then(fulfillment => { 
     dispatch(_acceptRequestSuccess(fulfillment)) 
     }) 
     .catch(err => { 
     console.log(err); 
     dispatch(_acceptRequestError(error)) 
     }) 
    } 
}