Versprechen.dann ist keine Funktion - Handhabung mehrere API-Aufrufe in Reagieren

Ich bin mit reagieren-wählen Sie zu auto-vervollständigen-Optionen in die Suche bar. Die Suchleiste zeigt die Ergebnisse in eine von zwei Kategorien, je nachdem, welches API-Endpunkt, den Sie trifft.

Gerade jetzt, es funktioniert mit Daten, die entweder aus einem Punkt oder das andere, aber ich habe Schwierigkeiten, die Rückgabe von Daten aus beiden Endpunkte zu reagieren-wählen Sie die loadOptions parameter.

Vom diese Antwort über mehrere API-Aufrufe, beschloss ich, verspricht wieder alle Daten auf einmal, aber ich bekomme die Fehlermeldung Uncaught TypeError: promise.then is not a function at Async.loadOptions

Hier ist mein code für loadOptions:

const getAsync = (tripId, destinationIndex, input) => {
  if (!input) {
    return { options: [] }
  }

  function getMusement(input) {
    return new Promise(function(resolve, reject) {
      TVApi.musement.autocomplete(input)
        .then((m) => {
          const musementOptions = m.map(musementToOption).slice(0, 4)
          return resolve(musementOptions)
        })
    })
  }

  function getFourSquare(tripId, destinationIndex, input) {
    return new Promise(function(resolve, reject) {
      TVApi.spot.autocomplete(tripId, destinationIndex, input)
        .then((fs) => {
          const fsOptions = fs.map(spotToOption).slice(0, 4)
          return resolve(fsOptions)
        })
    })
  }

  return Promise.all([getMusement(input), getFourSquare(tripId, destinationIndex, input)])
    .then((allData) => {
      const merged = [].concat.apply([], allData)
      console.log(JSON.stringify(merged)) //logs out with correct data
      return {options: merged}
    })
}
Vermeiden Sie die Promise Konstruktor antipattern!
tut TVApi.musement.autocomplete gibt ein Versprechen?
In welcher Zeile genau? Sind Sie sicher, dass die TVApi Methoden nicht immer wieder verspricht?
Wie kann ich dies tun, ohne es?
Man hätte einfach schreiben function getMusement(input) { return TVApi.musement.autocomplete(input).then(m => { … return musementOptions }) } (und das gleiche für getFourSquare)

InformationsquelleAutor crash springfield | 2017-05-11

Schreibe einen Kommentar