React-tags: useState

Привет, да, компонент работает с useState() так же хорошо, как и с компонентами на основе классов.

у вас есть пример, которым вы можете поделиться с помощью хуков? Я хочу использовать контролируемые компоненты.

у вас есть пример, которым вы можете поделиться с помощью хуков? Я хочу использовать контролируемые компоненты.

import React, { useState, useRef } from 'react'

export default function MyForm() {

  const tagsInput = useRef(null);

  const [tags, setTags] = useState([]);
  const [suggestions, setSuggestions] = useState([]);
  const [tagAutocompleteBusy, setTagAutocompleteBusy] = useState(false);

  async function onTagInput(query) {
      if (!tagAutocompleteBusy) {
          setTagAutocompleteBusy(true);
          const result = await fetch(`/tags/autocomplete?term=${query}`);
          setSuggestions(result.data);
          setTagAutocompleteBusy(false);
          return result;
      }
  }

  const onTagDelete = (i) => {
      setTags(() => {
          tags.splice(i, 1);
          return tags;
      });
  }

  const onTagAddition = (tag) => {
      setTags(() => {
          return [...tags, tag];
      });
  }

  return (<>
    <ReactTags
        ref={tagsInput}
        tags={tags}
        suggestions={suggestions}
        onDelete={onTagDelete}
        onAddition={onTagAddition}
        onInput={onTagInput}
    />
  </>);
}

Спасибо, что нашли время поделиться этим примером