2016-07-21 16 views
0

--Für Anfänger Entschuldigung für den mehrdeutigen Titel. Das Problem, das ich habe, bin ich wirklich verwirrt, wie man den Titel setzt. Ich bin offen für Änderungen. Im Grunde benutze ich react-redux und ich habe ein Modal, in dem ich einige Inhalte in der Datenbank aktualisiere. Bei der Aktualisierung möchte ich, dass der Zustand des Reduzierers standardmäßig ist und das Modal geschlossen wird. (Das ist einfach, da ich eine Funktion auf Update triggle, die alle Werte auf Standard setzt) Allerdings möchte ich auf Update das Modal schließen und eine Toastr on Update oder Fehlermeldung aus der Antwort anzeigen. Ich habe Komponenten und Aktionen für die Toastr.Wie man Werte asynchron zurücksetzt

Das Problem ist, dass der Toastr die Nachricht nicht anzeigt, da, bevor es die konstante Aktion aus dem Speicher übereinstimmen kann, die Reduzierungen für das Modal bereits auf Standard festgelegt sind. Was wäre der beste Ansatz, um dies zu überwinden?

Modal.jsx

//update 
    updateConfig() { 
      this.props.updateConfigNode(node, latestConfigData); //update action 
      this.closeModal(); 
     } 
    closeModal() { 
     this.props.status(false); //Close modal 
     this.props.update(''); //Set update action status 'updated or error' to '' 
     } 

Toastr.jsx

componentDidUpdate() { 
    this.routerConfigNotification(this.props.config); //Getting from store 
    } 
    configNotify(config) { 
     const message = checkForRouterConfigUpdateState(config); 
    if(message) { 
      this._addNotificationNormal(message.title, message.type, message.text); 
      } 
    } 

Utils

export function checkForRouterConfigUpdateState(routerConfig) { 

    let message = {}; 
    let messageText; 

    switch (_.get(routerConfig, 'updateStatus')) { 
case '_error': 
     messageText = 'An error has been occurred while updating configuration'; 
     return message = { 
     mode: 'normal', 
     title: 'Error', 
     type: 'info', 
     status: _.get(routerConfig, 'updateStatus'), 
     text: messageText 
     }; 

    case '_updated': 
     messageText = 'Successfully Updated'; 
     return message = { 
     mode: 'normal', 
     title: 'Updated', 
     type: 'info', 
     status: _.get(routerConfig, 'updateStatus'), 
     text: messageText 
     }; 
} 
} 

ich andere lifec versucht haben, Yle update Methoden, aber die nächste, die ich zur Lösung dieses Problems gewesen bin, ist setTimeout Funktion, die ich weiß, ist ein Hack und ich bin mir ziemlich sicher, es gibt eine Möglichkeit, diese Art von asynchronen Problemen zu bewältigen. Vielen Dank im Voraus.

+0

Umm, in einem dunklen erschossen, aber warum bestehen Sie darauf, modalen Zustand auf Update zu resetten? Stell es einfach auf, bevor es geöffnet wird, und du bist golden, nein? – WTK

+0

Versuchte das, aber sehen, wenn es einen anderen Aktionsauslöser zwischen dem toastr für das Update gibt, würde modal zeigen, weil ich den Zustand nicht zum Standard gesetzt habe. Bekomme ich meinen Standpunkt? –

+0

Thunk wird für asynchrone Aktionen in Redux verwendet. Hast du dich damit befasst? – andHapp

Antwort

0

Ist this.props.updateConfigNode(node, latestConfigData) ein Versprechen? Wenn ja, können Sie in einen then Block setzen, so dass es nur aufgerufen wird, wenn Ihre Anfrage erledigt ist.

this.props.updateConfigNode(node, latestConfigData).then(() => { 
    this.closeModal(); 
}); 
+0

Es ist kein Versprechen. –