访问 JavaScript / ReactJS 中的最内层查询

Question

Hello I want to print innermost content from following query, How can I access plans > personal > title, and print the content on screen.

Thanks a lot!

I get data from data.js which is shown below:

export default [
  {
    sys: {
      id: "1"
    },
    fields: {
      name: "cloud hosting",
      slug: "cloud-hosting",
      type: "hosting",
      price: 100,
      size: 200,
      capacity: 1,
      featured: true,
      description:
        "The power of SSD + Simplicity of cPanel",
      extras: [
        "Plush pillows and breathable bed linens",
        "Soft, oversized bath towels",
        "Full-sized, pH-balanced toiletries",
        "Complimentary refreshments",
        "Adequate safety/security",
        "Internet",
        "Comfortable beds"
      ],
      plans:[
        {
          fields:{
            personal:{
              title: "personal"
            }
          }
        }
      ]
    }
  }
];

Answer 1

You can make use of flatMap . I'm assuming your data is an array.

 var data = [{ sys: { id: "1" }, fields: { name: "cloud hosting", slug: "cloud-hosting", type: "hosting", price: 100, size: 200, capacity: 1, featured: true, description: "The power of SSD + Simplicity of cPanel", extras: [ "Plush pillows and breathable bed linens", "Soft, oversized bath towels", "Full-sized, pH-balanced toiletries", "Complimentary refreshments", "Adequate safety/security", "Internet", "Comfortable beds" ], plans: [{ fields: { personal: { title: "personal" } } }] }}]; result = data.flatMap(({fields})=>fields.plans.map(k=>(k.fields.personal.title))); console.log(result);