我试图从GraphQL查询中获取一些数据，但遇到了一些问题。
当我试图映射一些JSon数据时，我无法从数据中的数组中获取数据。
我不确定我错过了什么。
我尝试过的：
- 这很好：
<div>
{data.allDataJson.nodes.map(listing => (
<div>
<h2>{listing.name}</h2>
</div>
))}
</div>
但是当我尝试获取Camere数组时，我无法访问数据。
- 当我这样做时：它会给我错误
{data.allDataJson.nodes.map(listing => (
<div>
<h2>{listing.name}</h2>
<h2>{listing.camere}</h2>
</div>
))}
对象作为React子对象无效(已找到：具有键｛name，amount｝的对象(。如果要渲染子对象的集合，请改用数组。
- 还有：
<div>
{data.allDataJson.nodes.map(listing => (
<div>
<h2>{listing.name}</h2>
{listing.camere.map(
camere =>
<div>
<h1>{camere.name}</h1>
<h1>{camere.amount}</h1>
</div>
)}
</div>
))}
</div>
当我试着像在数组上一样在上面做.map时，我在帖子标题中得到了错误。
我的代码：
import React from 'react';
import { useStaticQuery, graphql } from "gatsby";
const Listing = () => {
const data = useStaticQuery(graphql`
query ListingQuery {
allDataJson {
nodes {
camere {
name
amount
}
name
}
}
}
`);
return (
<div>
{data.allDataJson.nodes.map(listing => (
<div>
<h2>{listing.name}</h2>
{listing.camere.map(home => <h1>{home.name}</h1>)}
</div>
))}
</div>
);
};
export default Listing;
我的数据：
[
{
"name":"Vila Franceza",
"detaliipret":{
"pret":"3000lei",
"perioada":"iunie - iulie",
"detaliu1":"Vila se inchiriaza exclusiv integral.",
"detaliu2":"Vila se poate inchiria de persoane juridice sau de persoane fizice."
},
"detaliidescriere":[
{
"text":"Vila Franceza este situată pe malul nordic al lacului Colibița, într-o poziție care asigură o perspectivă unică asupra lacului dar și a munților Călimani.",
"type":"normal"
},
{
"text":"La apă se ajunge prin intermediul debarcaderului situat la doar câțiva metri.",
"type":"normal"
},
{
"text":"Accesul la vilă vă ferește de vizitatori nedoriți.",
"type":"normal"
},
{
"text":"În apropierea vilei există mai multe restaurante și păstrăvării.",
"type":"normal"
},
{
"text":"Pentru amatorii de drumeții există trasee turistice pentru vizitarea împrejurimilor și a Munților Călimani. Zona este foarte darnică în privința ciupercilor de pădure.",
"type":"normal"
},
{
"text":"Există, de asemenea, rute pentru amatorii de mountain bike.",
"type":"normal"
},
{
"text":"Pentru a vă asigura discreția, liniștea și confortul de care aveți nevoie, nu se inchiriază camere individuale.",
"type":"normal"
},
{
"text":"Vila Franceza asigura un spatiu de cazare ideal pentru 15 persoane.",
"type":"normal"
},
{
"text":"Vila Franceza va ofera liniste, confort si discretie pentru o vacanta sau o luna de miere perfecta.",
"type":"normal"
},
{
"text":"Constructia este moderna iar peretii de sticla permit iluminarea naturala in cea mai parte a zilei. Lacul si crestele muntoase pot fi admirate cu usurinta, dar cu discretie, din interior.",
"type":"normal"
},
{
"text":"Inchirierea vilei se poate face pentru orice perioada din cursul unei saptamani pentru minim două zile. Din respect pentru confortul dumneavoastră, Vila Franceză se inchiriază exclusiv integral.",
"type":"normal"
},
{
"text":"In interiorul vilei nu se fumeaza! Sunt admise animale de companie.",
"type":"normal"
}
],
"camere":[
{
"name":"Livingroom deschis",
"amount":1
},
{
"name":"Bucătărie americană",
"amount":1
},
{
"name":"Sală pentru servirea mesei",
"amount":1
},
{
"name":"Ieșire directă pe terasă",
"amount":1
},
{
"name":"Terasă deschisă pentru plajă, sport, cu loc acoperit pentru servirea mesei",
"amount":1
},
{
"name":"Dormitor cu jacuzzi",
"amount":1
},
{
"name":"Dormitor VIP cu jacuzzi și pat king size",
"amount":1
},
{
"name":"dormitoare cu pat dublu",
"amount":5
},
{
"name":"salon cu canapea extensibilă dublă",
"amount":1
},
{
"name":"Spațiu de joacă pentru copii",
"amount":1
}
],
"dotari":[
"TV satelit",
"Wi-Fi",
"Sistem de sonorizare stereo profesional",
"Masa de biliard",
"Joc fotbal de masa Babyfoot",
"Doua caiace pentru amatorii de vaslit",
"Saniute pentru sezonul de iarna",
"Semineu cu lemne in living, cu scaune incalzite",
"Incalzire centrala (electrica, pe lemne, pe gaz )",
"Masina de spalat rufe",
"Masina de uscat rufe",
"Fier si masa de calcat",
"Uscatoare de par",
"Gril exterior XXL",
"Disc pentru grătar",
"Spa exterior cu apa ionizata, incalzi,ta, capacitate 10 persoane",
"Sauna",
"Debarcader privat pentru sporturi nautice",
"Mobilier de plaja",
"Parcare privată",
"Sistem de supraveghere video",
"Plita pe gaz",
"Microunde",
"Prajitor paine",
"Taietor electric",
"Robot de bucatarie",
"Vesela si accesorii pentru 20 de persoane",
"Masina de spalat vase",
"Frigider dublu",
"Cuptor pizza pentru 15 persoane. Se poate folosi si la patiserie, friptura etc",
"Expresor și filtru cafea"
]
},
{
"name":"Casa Pescarilor",
"detaliipret":{
"pret":"800lei",
"perioada":"iunie - iulie",
"detaliu1":"Vila se inchiriaza exclusiv integral.",
"detaliu2":"Vila se poate inchiria de persoane juridice sau de persoane fizice."
},
"detaliidescriere":[
{
"text":"Vila Franceza este situată pe malul nordic al lacului Colibița, într-o poziție care asigură o perspectivă unică asupra lacului dar și a munților Călimani.",
"type":"normal"
},
{
"text":"La apă se ajunge prin intermediul debarcaderului situat la doar câțiva metri.",
"type":"normal"
},
{
"text":"Accesul la vilă vă ferește de vizitatori nedoriți.",
"type":"normal"
},
{
"text":"În apropierea vilei există mai multe restaurante și păstrăvării.",
"type":"normal"
},
{
"text":"Pentru amatorii de drumeții există trasee turistice pentru vizitarea împrejurimilor și a Munților Călimani. Zona este foarte darnică în privința ciupercilor de pădure.",
"type":"normal"
},
{
"text":"Există, de asemenea, rute pentru amatorii de mountain bike.",
"type":"normal"
},
{
"text":"Pentru a vă asigura discreția, liniștea și confortul de care aveți nevoie, nu se inchiriază camere individuale.",
"type":"normal"
},
{
"text":"Vila Franceza asigura un spatiu de cazare ideal pentru 15 persoane.",
"type":"normal"
},
{
"text":"Vila Franceza va ofera liniste, confort si discretie pentru o vacanta sau o luna de miere perfecta.",
"type":"normal"
},
{
"text":"Constructia este moderna iar peretii de sticla permit iluminarea naturala in cea mai parte a zilei. Lacul si crestele muntoase pot fi admirate cu usurinta, dar cu discretie, din interior.",
"type":"normal"
},
{
"text":"Inchirierea vilei se poate face pentru orice perioada din cursul unei saptamani pentru minim două zile. Din respect pentru confortul dumneavoastră, Vila Franceză se inchiriază exclusiv integral.",
"type":"normal"
},
{
"text":"In interiorul vilei nu se fumeaza! Sunt admise animale de companie.",
"type":"normal"
}
],
"camere":[
{
"name":"Livingroom deschis",
"amount":1
},
{
"name":"Bucătărie americană",
"amount":1
},
{
"name":"Sală pentru servirea mesei",
"amount":1
},
{
"name":"Ieșire directă pe terasă",
"amount":1
},
{
"name":"Terasă deschisă pentru plajă, sport, cu loc acoperit pentru servirea mesei",
"amount":1
},
{
"name":"Dormitor cu jacuzzi",
"amount":1
},
{
"name":"Dormitor VIP cu jacuzzi și pat king size",
"amount":1
},
{
"name":"dormitoare cu pat dublu",
"amount":5
},
{
"name":"salon cu canapea extensibilă dublă",
"amount":1
},
{
"name":"Spațiu de joacă pentru copii",
"amount":1
}
],
"dotari":[
"TV satelit",
"Wi-Fi",
"Sistem de sonorizare stereo profesional",
"Masa de biliard",
"Joc fotbal de masa Babyfoot",
"Doua caiace pentru amatorii de vaslit",
"Saniute pentru sezonul de iarna",
"Semineu cu lemne in living, cu scaune incalzite",
"Incalzire centrala (electrica, pe lemne, pe gaz )",
"Masina de spalat rufe",
"Masina de uscat rufe",
"Fier si masa de calcat",
"Uscatoare de par",
"Gril exterior XXL",
"Disc pentru grătar",
"Spa exterior cu apa ionizata, incalzi,ta, capacitate 10 persoane",
"Sauna",
"Debarcader privat pentru sporturi nautice",
"Mobilier de plaja",
"Parcare privată",
"Sistem de supraveghere video",
"Plita pe gaz",
"Microunde",
"Prajitor paine",
"Taietor electric",
"Robot de bucatarie",
"Vesela si accesorii pentru 20 de persoane",
"Masina de spalat vase",
"Frigider dublu",
"Cuptor pizza pentru 15 persoane. Se poate folosi si la patiserie, friptura etc",
"Expresor și filtru cafea"
]
},
{
"name":"Modern Rooms Resort Colibita",
"detaliipret":{
"pret":"450lei",
"perioada":"iunie - iulie",
"detaliu1":"Vila se inchiriaza exclusiv integral.",
"detaliu2":"Vila se poate inchiria de persoane juridice sau de persoane fizice."
},
"detaliidescriere":[
{
"text":"Vila Franceza este situată pe malul nordic al lacului Colibița, într-o poziție care asigură o perspectivă unică asupra lacului dar și a munților Călimani.",
"type":"normal"
},
{
"text":"La apă se ajunge prin intermediul debarcaderului situat la doar câțiva metri.",
"type":"normal"
},
{
"text":"Accesul la vilă vă ferește de vizitatori nedoriți.",
"type":"normal"
},
{
"text":"În apropierea vilei există mai multe restaurante și păstrăvării.",
"type":"normal"
},
{
"text":"Pentru amatorii de drumeții există trasee turistice pentru vizitarea împrejurimilor și a Munților Călimani. Zona este foarte darnică în privința ciupercilor de pădure.",
"type":"normal"
},
{
"text":"Există, de asemenea, rute pentru amatorii de mountain bike.",
"type":"normal"
},
{
"text":"Pentru a vă asigura discreția, liniștea și confortul de care aveți nevoie, nu se inchiriază camere individuale.",
"type":"normal"
},
{
"text":"Vila Franceza asigura un spatiu de cazare ideal pentru 15 persoane.",
"type":"normal"
},
{
"text":"Vila Franceza va ofera liniste, confort si discretie pentru o vacanta sau o luna de miere perfecta.",
"type":"normal"
},
{
"text":"Constructia este moderna iar peretii de sticla permit iluminarea naturala in cea mai parte a zilei. Lacul si crestele muntoase pot fi admirate cu usurinta, dar cu discretie, din interior.",
"type":"normal"
},
{
"text":"Inchirierea vilei se poate face pentru orice perioada din cursul unei saptamani pentru minim două zile. Din respect pentru confortul dumneavoastră, Vila Franceză se inchiriază exclusiv integral.",
"type":"normal"
},
{
"text":"In interiorul vilei nu se fumeaza! Sunt admise animale de companie.",
"type":"normal"
}
],
"camere":[
{
"name":"Livingroom deschis",
"amount":1
},
{
"name":"Bucătărie americană",
"amount":1
},
{
"name":"Sală pentru servirea mesei",
"amount":1
},
{
"name":"Ieșire directă pe terasă",
"amount":1
},
{
"name":"Terasă deschisă pentru plajă, sport, cu loc acoperit pentru servirea mesei",
"amount":1
},
{
"name":"Dormitor cu jacuzzi",
"amount":1
},
{
"name":"Dormitor VIP cu jacuzzi și pat king size",
"amount":1
},
{
"name":"dormitoare cu pat dublu",
"amount":5
},
{
"name":"salon cu canapea extensibilă dublă",
"amount":1
},
{
"name":"Spațiu de joacă pentru copii",
"amount":1
}
],
"dotari":[
"TV satelit",
"Wi-Fi",
"Sistem de sonorizare stereo profesional",
"Masa de biliard",
"Joc fotbal de masa Babyfoot",
"Doua caiace pentru amatorii de vaslit",
"Saniute pentru sezonul de iarna",
"Semineu cu lemne in living, cu scaune incalzite",
"Incalzire centrala (electrica, pe lemne, pe gaz )",
"Masina de spalat rufe",
"Masina de uscat rufe",
"Fier si masa de calcat",
"Uscatoare de par",
"Gril exterior XXL",
"Disc pentru grătar",
"Spa exterior cu apa ionizata, incalzi,ta, capacitate 10 persoane",
"Sauna",
"Debarcader privat pentru sporturi nautice",
"Mobilier de plaja",
"Parcare privată",
"Sistem de supraveghere video",
"Plita pe gaz",
"Microunde",
"Prajitor paine",
"Taietor electric",
"Robot de bucatarie",
"Vesela si accesorii pentru 20 de persoane",
"Masina de spalat vase",
"Frigider dublu",
"Cuptor pizza pentru 15 persoane. Se poate folosi si la patiserie, friptura etc",
"Expresor și filtru cafea"
]
}
]
我想做的事：
从所有数据中获取所有详细信息。
执行条件渲染。
为了便于阅读，添加另一个函数为每个camere提取names。
const getNames = (camere) => (camere.map(home => <h1>{home.name}</h1>))
{data.allDataJson.nodes.map(listing => (
<div>
<h2>{listing.name}</h2>
{
listing.camere &&
listing.camere.length > 0 &&
this.getNames(listing.camere)
}
</div>
))}