React-tags: राज्य का उपयोग करें

हैलो, हाँ घटक वर्ग आधारित घटकों के साथ ही 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}
    />
  </>);
}

इस उदाहरण को साझा करने के लिए समय निकालने के लिए धन्यवाद @ कुलाहिन