React-tags: Das Aktualisieren von Vorschlägen aktualisiert die Optionsliste nicht bis zur nächsten Eingabe (v6)

Hallo @yrik , das Abrufen von Daten wird nicht von der Komponente bereitgestellt, sondern von

In Anlehnung an die Beispiele in #205 würde ich vorschlagen, mehr Vorschläge abzurufen, als Sie anzeigen müssen. Wenn Sie beispielsweise derzeit 6 Vorschläge anzeigen, versuchen Sie, 12 oder 15 vom Server abzurufen. Auf diese Weise sollten suggestionsFilter noch einige relevante Daten haben, die verwendet werden können, bis neue empfangen werden.

Vielen Dank, dass Sie zurückkommen!
Es ist ein etwas anderes Problem.
Stellen Sie sich vor, ich habe eine Autovervollständigung für das Wort " Bier "

1. Vorschlagsliste ist leer ( [] )
2. Benutzertypen " be " --> Server gibt [Bee, Beard, Beetroot, Beer] zurück (wir zeigen nichts, da die Optionsliste nicht aktualisiert wird, da der Server nach dem Aufruf von getOptions Daten zurückgibt)
3. Benutzer gibt " Biene " ein --> Server gibt [Biene, Rote Beete, Bier] zurück, wir zeigen [Biene, Bart, Rote Bete, Bier], wir zeigen zuvor aktualisierte Daten, keine neuen
4. Benutzer gibt " Bier " ein --> Server gibt [Bier] zurück, wir zeigen [Biene, Rote Beete, Bier], wir zeigen zuvor aktualisierte Daten, keine neuen

Wenn onInput async wäre, würde es funktionieren. Oder wenn es eine Möglichkeit gibt, const options = getOptions.call(this, query) von benutzerdefinierten onInput aufzurufen, würde es auch funktionieren.

OK, ich glaube, ich folge - daher werden möglicherweise Vorschläge angezeigt, die nicht mit der aktuellen Abfrage übereinstimmen sollten, ist das richtig?

Ich werde versuchen, das Problem mit diesem Beispielcode zu rekonstruieren

OK, ich glaube, ich folge - daher werden möglicherweise Vorschläge angezeigt, die nicht mit der aktuellen Abfrage übereinstimmen sollten, ist das richtig?

Genau! In meinem Fall wird fast immer das Ergebnis der vorherigen Abfrage angezeigt. Außer in den Fällen, in denen die Antwort im Browser zwischengespeichert und sofort zurückgegeben wird.

Ich habe versucht, es mit jsfiddle neu zu erstellen, habe es aber nicht geschafft, die Bibliothek dort richtig zu verbinden.
Wenn Sie ein grundlegendes Beispiel für dieses Plugin in jsfiddle haben, kann ich es mit einem serverseitigen Autocomplete-Beispiel erweitern.

Es ist auch erwähnenswert, dass ich v6 verwende und das Beispiel, das Sie haben, wie eine vorherige Version aussieht.
"react-tag-autocomplete": "6.0.0-beta.5"

Ich glaube, dieses Problem wurde in v6 durch den Wunsch eingeführt, componentWillReceiveProps() aufgrund von Änderungen in den letzten und kommenden Versionen von React zu vermeiden. In der neuen Version habe ich die Vorschläge so umgestaltet, dass sie nur auf Mount und onInput aktualisiert werden, was die Änderung der Vorschläge nicht berücksichtigt.

Es kann mit getDerivedStateFromProps() gelöst werden, aber ich denke, dieser Ansatz erfordert einige Optimierungen, um unnötige Renderings zu vermeiden.

  static getDerivedStateFromProps (props, state) {
    const options = getOptions(props, state)
    return { options }
  }

Ich habe ein paar Minuten damit verbracht und denke, ich habe eine geeignete Lösung gefunden. Die folgende Animation zeigt die asynchrone Aktualisierung der Vorschläge und die Aktualisierung der Optionsliste ohne weitere Eingaben:

Die Änderung war recht einfach, also werde ich noch einige Tests durchführen und eine PR erstellen.

Ich denke, useEffect sollte dies gut abdecken, da es die Änderung von Optionen überwachen könnte.

useEffect(() => {
  setOptions(getOptions(props, state))
}, [options]);

Ich habe v6.0.0-beta.6 das dieses Problem beheben sollte.