React-tags: Обновление опоры предложений не обновляет список опций до следующего ввода (v6)

Привет, @yrik , выборка данных не обеспечивается компонентом, а осуществляется вами самими. Хотя я не могу отлаживать отдельные реализации, я рад дать несколько советов.

Следуя примерам в # 205, я бы посоветовал получить больше предложений, чем вам нужно отобразить. Например, если вы сейчас показываете 6 предложений, попробуйте получить 12 или 15 с сервера. Таким образом, в suggestionsFilter должны быть некоторые релевантные данные для использования до тех пор, пока не будут получены новые.

Спасибо, что вернулись!
Это немного другая проблема.
Представьте, что у меня есть автозаполнение для слова " пиво "

1. список предложений пуст ( [] )
2. пользовательские типы " быть " -> сервер возвращает [пчела, борода, свекла, пиво] (мы ничего не показываем, потому что список опций не обновляется, поскольку сервер возвращает данные после вызова getOptions)
3. пользователь вводит " пчела " -> сервер возвращает [пчела, свекла, пиво] мы показываем [пчела, борода, свекла, пиво], мы показываем ранее обновленные данные, а не свежие
4. пользователь вводит " пиво " -> сервер возвращает [пиво], мы показываем [пчела, свекла, пиво], мы показываем ранее обновленные данные, а не свежие

Если onInput будет async это сработает. Или, если есть способ вызвать const options = getOptions.call(this, query) из пользовательского onInput это тоже сработает.

Хорошо, я думаю, что следую - поэтому могут отображаться предложения, которые не должны соответствовать текущему запросу, это правильно?

Я попытаюсь воссоздать проблему с помощью этого примера кода.

Хорошо, я думаю, что следую - поэтому могут отображаться предложения, которые не должны соответствовать текущему запросу, это правильно?

Точно! В моем случае почти всегда отображается результат предыдущего запроса. За исключением случаев, когда ответ кешируется в браузере и возвращается мгновенно.

Я пытался воссоздать его с помощью jsfiddle, но мне не удалось правильно подключить библиотеку.
Если у вас есть базовый пример этого плагина в jsfiddle, я могу дополнить его примером автозаполнения на стороне сервера.

Также стоит отметить, что я использую v6, и ваш пример похож на предыдущую версию.
"response-tag-autocomplete": "6.0.0-beta.5"

Я считаю, что эта проблема возникла в v6 из-за желания избежать componentWillReceiveProps() из-за изменений в последних и будущих версиях React. В новой версии я отредактировал предложения, чтобы они обновлялись только при монтировании и onInput что не учитывает изменение опоры предложений.

Это можно решить, используя getDerivedStateFromProps() но я думаю, что этот подход потребует некоторой оптимизации для предотвращения ненужных рендеров.

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

Я потратил на это несколько минут и думаю, что нашел подходящее решение, анимация ниже показывает, что подпорка предложений обновляется асинхронно, а список опций обновляется без каких-либо других входных данных:

Изменение было довольно простым, поэтому я проведу еще несколько тестов и подниму PR.

Я полагаю, что useEffect должно хорошо покрыть это, поскольку он может отслеживать изменение параметров.

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

Я выпустил v6.0.0-beta.6 который должен решить эту проблему.