Как сделать метатег .map () в Next. js

Question

Я пытаюсь .map содержимое мета, но отображение повторяется несколько раз целых метатегов. Вот мой код

{general.head.articleAuthor.en.map(( ) => (
          <meta property="article:author" content={general.head.articleAuthor.en} />
        ))}

export const general = {
head: {
articleAuthor: {
en: ['name1', 'name2']}
}
}

Я ожидаю, что результат должен быть таким: <meta property="article:author" content="name1,name2"/>

Но мой код отображается так: <meta property="article:author" content="name1,name2"/> <meta property="article:author" content="name1,name2"/>

Теперь, если я добавьте name3, тогда это отобразит всю мету 3 раза. Я не хочу, чтобы мета-теги копировались. Мне нужен контент для сопоставления.

Answer 1

... но отображение повторяется несколько раз целых мета-тегов ...

Я могу представить две интерпретации этого. Но в комментарии вы написали:

Мне просто нужно имя1, имя2 для сопоставления. Не все метатеги отображаются несколько раз.

Звучит так, как будто вы хотите один meta тег, содержащий всех авторов. Для этого используйте join вместо map:

<meta property="article:author" content={general.head.articleAuthor.en.join(", ")} />
// −−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−^^^^^^^^^^^

, что даст вам

<meta property="article:author" content="name1, name2"} />

или подобное. Строка является разделителем. Так что если вам не нужен пробел после запятой, просто измените его с ", " на ",".

---

Другой способ, которым я читаю вопрос, который я сейчас считаю неправильным, но может быть полезным для других, это то, что вы хотели meta для каждого автора. Для этого используйте значение, переданное map, а не general.head.articleAuthor.en в content:

{general.head.articleAuthor.en.map(author => (
// −−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−^^^^^^
  <meta property="article:author" content={author} />
// −−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−^^^^^^
))}

Answer 2

Вместо всех используйте текущий объект в итерации:

{general.head.articleAuthor.en.map((obj) => (
      <meta property="article:author" content={obj} />
 ))}

Я ожидаю, что результат должен быть таким: <meta property="article:author" content="name1,name2"/>

Поскольку en определен как массив, вы можете использовать .join(), чтобы получить все значения в одном метатеге. Это не нужно на карту.

{ <meta property="article:author" content={general.head.articleAuthor.en.join(',')} /> }