123456789101112131415161718192021222324252627282930313233343536373839404142434445464748 |
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="utf-8">
- <title>GraphQL</title>
- </head>
- <body>
- <script>
- const gql=(url,query, variables)=>fetch(url, {method:"POST",headers:{'content-type':'application/json'}, body: JSON.stringify({query,variables})}).then(res=>res.json());
- (async ()=>{
- let data=await gql("http://shop-roles.asmer.fs.a-level.com.ua/graphql", `query cats($q:String){
- CategoryFind(query:$q){
- name goods{
- name images{
- url
- }
- }
- }
- }`, {q: "[{}]"});
- console.log(data);
- console.log(data.data)
- let div = document.createElement('div');
- for (const key in data.data) {
- for(let keys of data.data[key]){
- let p = document.createElement('h3');
- p.innerHTML=keys.name;
- div.append(p);
- if(Array.isArray(keys.goods)){
- for(let i of keys.goods){
- let p2=document.createElement('p');
- p2.style.marginLeft=50+'px';
- p2.innerHTML=' - '+i.name;
- div.append(p2);
- }
- }else{
- let p2=document.createElement('p');
- p2.innerHTML=' - '+keys.goods;
- }
- }
- }
- document.body.append(div);
- })();
-
- </script>
- </body>
- </html>
|