通过数组获取[object Object]映射

如何解决通过数组获取[object Object]映射

我正在尝试在我的nextJS应用程序中从wordpress CMS中吐出数据。这是个。 ACF转发器字段。我可以通过编辑器很好地获取数据，但是尝试使用map将其推送到页面上，我只是获得了[object object]。

下面是有问题的代码-我只是误解了Map应该如何工作？

 <div className="steve"
  // eslint-disable-next-line react/no-danger
  dangerouslySetInnerHTML={{
   __html: node.GlobalFAQ.faq.map((data) => (
            <div>
              {data.question}
              {data.answer}
            </div>
          )),}}
      />

这是归还给我的东西

[object Object],[object Object],[object Object]

此代码工作正常，这不是将中继器称为ACF组中的一个字段。

      <div className={blogStyles.blocksContainer}
       // eslint-disable-next-line react/no-danger
       dangerouslySetInnerHTML={{ __html: node.AboutBlocks.blockThree }}
     />

然后下面是我的查询

    query AllPosts {
  posts(where: {id: 25}) {
    edges {
      node {
        id
        date
        title
        slug
        Header {
          headerImage {
            mediaItemUrl
          }
          headerText
        }
        AboutBlocks {
          blockOne
          blockThree
          blockTwo
        }
        SalesBlock {
          salesBlockOne
          salesBlockThree
          salesBlockTwo
        }
        title
        GlobalFAQ {
          faq {
            question
            answer
          }
        }
      }
    }
  }
}

这是我调出node.GlobalFAQ.faq

后得到的结果

Array(6)

0：{问题：“我如何为我的订单付款？”，答案：“

我们将提供一个订单摘要链接，例如，...在其他任何电子商务商店中，您都会看到。

↵“} 1：{问题：“我怎么知道我会开车呢？”，回答：“

想在发送mo之前进行研究……＃8217；很高兴知道它在那里。）

↵“} 2：{问题：“如果我发现低于您报价的价格怎么办？”，回答：“

哇。您一定已经找到了一笔非常划算的交易。例如……我们会不时尝试't。）

↵“} 3：{问题：“您要销售第二轮或损坏的车轮吗？”，回答：“

否。除非特别列出为有瑕疵的行车，第一轮和制造保修。

↵”} 4：{问题：“您也出售轮胎吗？”，答案：“

是。我们可以通过…els享受折扣价。让我们知道您想要的价格。

↵”} 5：{问题：“您如何能以比其他地方便宜的价格出售车轮？”，答案：“

我们可以出售的主要原因有两个，因此价格可以传递给我们的客户。

↵“} 长度：6 原始：数组（0）

解决方法

好吧，我找到了答案，而且我不敢相信我花了两个多小时与之抗争>。

它正在设置'dangerouslySetInnerHTML'

下面的代码可以正常工作。

        <div>
        {node.GlobalFAQ.faq.map((item) => (
          <div>
            <p>{item.question}</p>
            <p>{item.answer}</p>
          </div>
        ))}
      </div>