在数组中组合多个const =?

时间:2018-03-29 04:54:07

标签: javascript reactjs graphql

如何在数组中将const = menuGallerymenuCompanymenuTour的数据合并到menuData内的所有数据中(请参阅下面的代码)这样我的li就会显示graphQl

中所有三个的const = menuData数据
render() {
  const menuGallery = get(this.props, 'data.allContentfulImageGallery.edges')
  const menuCompany = get(this.props, 'data.allContentfulCompanyPage.edges')
  const menuTour = get(this.props, 'data.allContentfulTourPage.edges')
  const menuData = [{menuGallery},{menuCompany},{menuTour}]

  return(
    {menuData.map(({ node: page })=> (
      <li className={slug === page.slug ? "selected" : ""} key={page.id}><a href={`/${page.slug}`}>{page.title}</a></li>
  ))}

如果我将当前const menuData更改为const menuData = menuGallery,它将显示来自allContentfulImageGallery的数据,但在合并多个时,它们不会映射数据。

graphQl查询

export const menuQuery = graphql`
query menuQuery($slug: String!) {
    allContentfulCompanyPage(sort: {fields: [menuOrder], order: ASC}) {
      edges {
        node {
          id
          title
          slug
        }
      }
    }
    allContentfulTourPage(sort: {fields: [menuOrder], order: ASC}) {
      edges {
        node {
          id
          title
          slug
        }
      }
    }
    allContentfulImageGallery(sort: {fields: [menuOrder], order: ASC}) {
      edges {
        node {
          id
          title
          slug
        }
      }
    }
  }
`

每个都可以单独映射,但我有多个内容类型构成了应用页面,并希望将它们列在一起。

1 个答案:

答案 0 :(得分:5)

听起来您想使用spread operator将三个数组合并为一个长数组。

const menuData = [...menuGallery, ...menuCompany, ...menuTour]