How I can loop into api-pltform json data using vue axios

Question

{  
   "@context":"\/contexts\/Movie",
   "@id":"\/movies",
   "@type":"hydra:Collection",
   "hydra:member":[  
      [  
         {  
            "id":"001db4b9-7042-11e9-b3a6-0ac98b070556",
            "title":"Kalank",
            "originalTitle":"कलंक",
            "originalLanguage":"",
            "description":"Kalank is an Indian Hindi-language period drama film directed by Abhishek Varman and produced by Karan Johar, Sajid Nadiadwala and Fox Star Studios.\n\nCinema: Cineco City Center\nMovie Timings:  5.00 + 8.15 + 11.30 PM.\n",
            "releasedAt":"2019-04-17T00:00:00+00:00",
            "imdbId":"tt6988116",
            "posterUrl":null,
            "genre":"Drama",
            "cinemaName":"Cir"
         },
         {  
            "id":"00bfc9b3-7042-11e9-b3a6-0ac98b070556",
            "title":"Stockholm",
            "originalTitle":"Stockholm",
            "originalLanguage":"",
            "description":"Based on the absurd but true 1973 bank heist and hostage crisis in Stockholm that was documented in the New Yorker as the origins of the ‘Stockholm Syndrome’.\n\nCinema: Cineco Seef II\nMovie Timings:  7.00 + 9.00 + 11.00 PM.\n",
            "releasedAt":"2019-04-12T00:00:00+00:00",
            "imdbId":"tt6474040",
            "posterUrl":"\/ko3AS33BLNEBcp1CO4FvdRltTxr.jpg",
            "genre":"Drama",
            "cinemaName":"SeI"
         },
         {  
            "id":"0181072c-7042-11e9-b3a6-0ac98b070556",
            "title":"Shazam!",
            "originalTitle":"Shazam!",
            "originalLanguage":"",
            "description":"We all have a superhero inside us, it just takes a bit of magic to bring it out. In Billy Batson’s case, by shouting out one word – SHAZAM! – this streetwise fourteen-year-old foster kid can turn into the adult superhero Shazam.\n\nCinema: Cineco City ",
            "releasedAt":"2019-03-23T00:00:00+00:00",
            "imdbId":"tt0448115",
            "posterUrl":"\/xnopI5Xtky18MPhK40cZAGAOVeV.jpg",
            "genre":"Action",
            "cinemaName":"Center"
         },
         {  
            "id":"06b71b0a-6de5-11e9-962d-0adc8ab87612",
            "title":"Escape Room",
            "originalTitle":"Escape Room",
            "originalLanguage":"",
            "description":"Six strangers find themselves in a maze of deadly mystery rooms, and must use their wits to survive.\n\nCinema: Cineco City Center\nMovie Timings:  10.30 AM. + 12.30 + 2.30 + 4.30 + 6.30 + 8.30 + 10.30 PM.\n",
            "releasedAt":"2019-01-03T00:00:00+00:00",
            "imdbId":"tt5886046",
            "posterUrl":"\/15AlGTlaZa3W2zmIL4ehnCh8Xe0.jpg",
            "genre":"Action",
            "cinemaName":"Center"
         }
}],

 {  
         "page":1,
         "pageSize":25,
         "pageCount":8,
         "totalHits":176
      }
   ],
   "hydra:totalItems":2
}

I have an api-platform data source in a JSON format as shown above. However, I would like to print each record in vue js app in a

..

I tried the following and doesn't work:

<ul>
   <li v-for="movie in movies">

  {{ movie['hydra:member'][0][0].title}} 

   </li>
<li v-for="movie in movies">

  {{ movie['hydra:member'][0][0].genre}} 

   </li>
</ul>
  </div>

Any help how to loop in api-platform JSON data using Vue axion ?! I need the correct for loop to print the data available in movie['hydra:member'][0][0].objects

ittus · Accepted Answer · 2019-05-08 01:30:18Z

1

You can try

<ul>
   <li v-for="movie in movies['hydra:member']">
      {{ movie[0].title}}
      {{ movie[0].genre}}
   </li>
</ul>

answered May 8, 2019 at 1:30

ittus

22.5k5 gold badges62 silver badges59 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How I can loop into api-pltform json data using vue axios

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related