title: How would I iterate through pokeAPI to get all subsequent pokemon data?
body: <p>Hi I'm using Vuejs to get some pokemon data. So I figured out how to retrieve all the pokemon name and their api urls to get more information about them. The issue is I don't know how to take those URLs and access each pokemon's specific data. I tried to increment a variable and concatenate it to the URL to get their data but it didn't work. I also tried to access the data from the api call I already but that also didn't work.  </p>
  
  <pre><code>&lt;template&gt;
    &lt;div&gt;
      &lt;h2&gt;{{subtitle}}&lt;/h2&gt;
      &lt;div v-for="pokemon in basicInfo" v-bind:key="pokemon.name"&gt;
    &lt;span&gt;{{ pokemon.name}}&lt;/span&gt;
  &lt;/div&gt;
  &lt;!-- Nothing is produced, and I dont get I an error --&gt;
  &lt;div v-for="pokemon2 in advInfo" v-bind:key="pokemon2.index"&gt;
    &lt;span&gt;{{pokemon2}}&lt;/span&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>
  </p>
  
  <pre><code>&lt;script&gt;
  import axios from "axios";
  
  export default {
    data() {
      return {
        subtitle: "First 150 pokemon",
        basicInfo: [],
        advInfo:[],
        i:0
      };
    },
    methods: {
      // trying to increment i 
    getNext: function(){
      this.i=i++;
    }
    },
    mounted() {
      axios
    // this gets a list of the first 20 pokemon. I can get the pokemon's name and their url
    .get("https://pokeapi.co/api/v2/pokemon/")
  
    .then(response =&gt; {
      this.basicInfo = response.data.results;
    });
  
        // here I'm trying to access more specific data on each pokemon by concatenating a number to the url 
      axios
        .get("https://pokeapi.co/api/v2/pokemon/5")
  
        .then(response =&gt; {
          this.advInfo= response.data.results;
  
        });
  
    }
  };
  &lt;/script&gt;
  
  &lt;style scoped&gt;
  
  &lt;/style&gt;
  </code></pre>