Как я могу войти в api-pltform JSON-данные, используя 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
}

У меня есть источник данных api-платформы в формате JSON, как показано выше.Тем не менее, я хотел бы напечатать каждую запись в приложении Vue JS в

..

Я попробовал следующее и не работает:

<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>

Любая помощь, как циклв данных JSON платформы API с использованием Vue Axion?!Мне нужен правильный цикл for для печати данных, доступных в фильме ['hydra: member'] [0] [0] .objects

Answer 1

Вы можете попробовать

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