繁体   English   中英

JS / React - 如何在 object 中同时使用 map 两个对象

[英]JS / React - how to .map two objects at once from within an object

我正在开发一个 React Gatsby.js项目。 对于搜索 function,我使用了一个名为gatsby-plugin-local-search 的插件

为了使这个插件工作,我必须在gatsby-config.js文件中运行 GraphQL 查询。 然后在规范器中处理数据。 下面是脚本的示例代码。 请注意我拿出了normelizer。 因为我的问题就在这个范围内,我将在下面详细讨论。

    {
      resolve: "gatsby-plugin-local-search",
      options: {
        name: "pagesNL",
        engine: "flexsearch", // The following engines are supported: flexsearch, lunr
        engineOptions: "speed", // Note: Only the flexsearch engine supports options.
        query: `
          {
            allSanityPage {
              nodes {
                id
                title {
                  _key
                  _type
                  en
                  nl
                }
                _rawBlockRows
                slug {
                  current
                }
              }
            }
            allSanityBlog {
              nodes {
                title {
                  _type
                  en
                  nl
                }
                slug {
                  current
                }
                _id
                _rawBody
              }
            }
          }
        `,
        ref: "id",
        index: ["id", "title", "body"],
        store: ["id", "path", "title"],
        normalizer: ({ data }) => (
            // do something with the data <----------------
        ),
      },

如您所见,我查询allSanityPageallSanityBlog 现在的目标是从此脚本中同时合并数据和 map。

问题

我怎样才能.map()他们一次?

首先是allSanityPage的工作示例

       normalizer: ({ data }) => (
          data.allSanityPage.nodes.map(node => ({
            id: node.id,
            path: node.slug.current,
            title: localizeData(node.title, "nl"),
            body: localizeData(node._rawBlockRows, "nl"),
          }))
       ),

我正在寻找一种使用对象data.allSanityPage.nodesdata.allSanityBlog.nodes填充它的方法

我认为这样的事情会起作用:

{...data.allSanityPage.nodes, ...data.allSanityBlog.nodes}.map()

但这显然行不通

(我不担心body:因为我会像body: (node._rawBlockRows)? localizeData(node._rawBlockRows, "nl"): localizeData(node._rawBody, "nl"), `

实际上,当您尝试{...data.allSanityPage.nodes, ...data.allSanityBlog.nodes}.map()时,您的想法很好

错误是你.map()一个object,它的原型中没有那个function。

尝试[...data.allSanityPage.nodes, ...data.allSanityBlog.nodes].map(...

资料来源: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map

您可以在第一个映射函数中嵌套 map 函数

 normalizer: ({ data }) => (
      data.allSanityPage.nodes.map(node => 
          data.allSanityBlog.nodes.map(node2 =>
             //your code
             )
           )

这方面的一个例子是

a.map(e1 => b.map(e2 => 
     console.log(e1 == e2)))

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM