Why doesn't the loop in template wait for a promise?

Question

JavaScript

There is a loop in the template:

<td v-for="type in rank">
  <img v-for="hero in type" :src="load(hero)">
</td>

And there is a method:

async load (name) {
  const response = await axios.jsonp(`url/${name}`)
  return response.url
}

Why does src get an object Promise?

Answer 1

Because the cycle is v-forsynchronous. It receives a response (promise) from your function and outputs it. It does not look at what kind of answer it is and does not change it in any way (Does not wait for a promise).