map() loop in react-CodePudding

I have a graphQL output object like this `

const techData = useStaticQuery(graphql`
    query {
      allWpPage {
        nodes {
          pageSettings {
            techDescription
            technologies {
              techName
              techText
            }
          }
        }
      }
    }
  )

And my output that I see in graphQL IDE is like https://i.imgur.com/FrdZpUP.png I want to loop through the technologies array in jsx. I have tried this kind of thing.

let newarr = techData.allWpPage.nodes[0].pageSettings
{newarr.technologies.map(({techname}) => {
return(<p>{techname}</p>)
})}

I am getting {techname} blank. How can I achieve it?

CodePudding user response：

techname should replace with techName. this is typo problem.