title: how to loop through nested json response with vue js
body: <p>I'm actually a newbie to Vue JS, so i've been having a bit of a problem looping through api responses with v-for
  here's my html</p>
  <p>Get Coins Data</p>
  <pre><code>&lt;div v-for=&quot;coin in coinsData&quot;&gt;{{coinsData.data.coins.name}}&lt;/div&gt;
  </code></pre>
  <p>my javascript:</p>
  <pre><code> var app = new Vue({
          el: '#app',
          data: {
              coinsData: []
          },
          methods: {
      getCoinsData() {
        fetch(&quot;https://api.coinranking.com/v1/public/coins&quot;)
          .then(response =&gt; response.json())
          .then(data =&gt; (this.coinsData = data));
      }
    }
      })
  </code></pre>
  <p>the response I want to loop through is at <a href="https://api.coinranking.com/v1/public/coins" rel="nofollow noreferrer">https://api.coinranking.com/v1/public/coins</a>
  Its quite large so I didn't paste it in here :)</p>