React-tags: gunakanNegara

Halo, ya, komponen berfungsi dengan baik dengan useState() seperti halnya dengan komponen berbasis kelas.

apakah Anda memiliki contoh yang dapat Anda bagikan dengan menggunakan kait? Saya ingin menggunakan komponen yang dikontrol.

apakah Anda memiliki contoh yang dapat Anda bagikan dengan menggunakan kait? Saya ingin menggunakan komponen yang dikontrol.

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}
    />
  </>);
}

Terima kasih telah meluangkan waktu untuk membagikan contoh ini @kulahin