Nicht erfasster TypeError: tags.join ist keine Funktion.

Question

Ich habe eine Seite mit mehreren Tags, die in einem Array gespeichert sind. Ich möchte die Seite bearbeiten und beim Versuch, das Tag-Array in TagsInput zu laden, erhalte ich die folgende Fehlermeldung:

Nicht erfasster TypeError: tags.join ist keine Funktion

Hier ist der Codeausschnitt zu diesem Fehler:

import { TagsInput } from "react-tag-input-component";

const UpdatePage = () =>

  const [tags, setTags] = useState("");
  const tagsString = tags.join(", ");

  // Tags vom Backend abrufen und in setTags speichern
  setTags(<some_code_for_axios_get>)

  zurückkehren(
    <div>
        <FormControl fullWidth margin="normal">
          <TagsInput
            label="Tags"
            Größe = „klein“
            value={tagsString}
            onChange={setTags}
            placeHolder="Geben Sie Ihren Tag ein und drücken Sie die Eingabetaste"
          />
        </FormControl>
    </div>
 )

}

Habe auch Folgendes versucht und die Fehlermeldung erhalten, dass n.map keine Funktion ist:

<div className="tags">
  {tags.length
    ? tags.map((type, i) => (
      <TagsInput
        Schlüssel={i}
        label="Tags"
        Größe = „klein“
        Wert={i}
        onChange={setTags}
        placeHolder="Geben Sie Ihren Tag ein und drücken Sie die Eingabetaste"
      />
      ))
    : <TagsInput
        label="Tags"
        Größe = „klein“
        value={tags}
        onChange={setTags}
        placeHolder="Geben Sie Ihren Tag ein und drücken Sie die Eingabetaste"
      />
    }
</div>

Mit dem folgenden Code kann ich die Daten in der Konsole sehen:

tags.forEach((element) => {
    console.log(element);
  });

Answer 1

标签不是一个数组，它们是一个字符串，根据这一行：

const [tags, setTags] = useState("");

无论发生什么情况 setTags(<some_code_for_axios_get>), the first render, tags will be ""