React-tags: Server-side autocomplete example?

Created on 30 Apr 2020  ·  4Comments  ·  Source: i-like-robots/react-tags

question

Most helpful comment

All 4 comments

yay!, just looking for this!

example with axios and hooks:

  //initial api call
  const [{ data: labelsData }, doGetLabels] = useAxios({
    url: '/labels',
  })

  const [suggestions, setSuggestions] = useState([])
  const [busy, setBusy] = useState(false)
  const handleInputChange = debounce((name) => {
    if (!busy) {
      setBusy(true)
      doGetLabels({ params: { name } })
    }
  })
  //getResponseData is my custom parser for the BE response
  useEffect(() => {
    const labels = labelsData ? getResponseData(labelsData).labels : []
    if (setBusy) {
      setBusy(false)
    }
    setSuggestions(labels)
  }, [labelsData])

Rest of the code remains the same as the @i-like-robots PR

Thanks for the example, seems like there is a small issue @i-like-robots.
The options list is updated directly after the onInput custom handler https://github.com/i-like-robots/react-tags/blob/6.0/lib/ReactTags.js#L130.
However, when I query the server inside of onInput handler it takes some time.
In a result, the options list always contains list of suggestions from the previous call, not the latest one.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

famouspotatoes picture famouspotatoes  ·  5Comments

filippofilip95 picture filippofilip95  ·  4Comments

williamsidewalk picture williamsidewalk  ·  4Comments

yrik picture yrik  ·  10Comments

luciemac picture luciemac  ·  7Comments