React - Funktionswert an setState zurückgeben

Question

Ich muss den Wert checkSuggestionList der Funktion an this.state.validSearchParentInput zurückgeben. Die Funktion checkSuggestionList gibt den richtigen Wert zurück, wird aber nicht an this.state.validSearchParentInput übergeben. Ich glaube setState setzt den Wert, bevor die Funktion checkSuggestionList beendet wird.

checkSuggestionList = (newValue) => { 
     for (let i = 0; i < nodes.length; i++) { 
     let node = nodes[i].name 
     console.log('node: ' , node) 
     if (node.toLowerCase() === newValue.toLowerCase()) { 
      console.log('did find case') 
      return true 
     } else { 
      console.log('didn\'t find case') 
     } 
     return false 
     } 
    } 

    searchParents__onChange = (event, { newValue, method }) => { 
    this.setState({ 
     validSearchParentInput: this.checkSuggestionList(newValue), 
     searchParentsValue: newValue 
    }) 
    this.checkProgress() 
    } 

Answer 1

Die setState-Funktion einer React-Komponente is not guaranteed to be synchronous, kann aber aus Leistungsgründen asynchron ausgeführt werden.

Wahrscheinlich lesen Sie den Status, bevor die Änderung angewendet wurde.

Um dies zu lösen, könnten Sie setState ‚s zweite Parameter verwenden, die eine Callback-Funktion übernimmt, die nach dem Zustandsübergang gemacht wurde ausgeführt:

this.setState({ 
    validSearchParentInput: this.checkSuggestionList(newValue), 
    searchParentsValue: newValue 
}, function() { 
    this.checkProgress() 
}) 

Answer 2

setState-Aktionen sind asynchron. Dies wird in der Dokumentation von setState erläutert (Referenz:)

setState() mutiert nicht sofort this.state, sondern erzeugt einen ausstehenden Statusübergang. Der Zugriff auf this.state nach dem Aufruf dieser Methode kann möglicherweise den vorhandenen Wert zurückgeben. Es gibt keine Garantie für den synchronen Betrieb von Aufrufen von setState, und Aufrufe können für Leistungssteigerungen gebündelt werden.