Javascript 在v-for列表（Vue.js）中搜索giphy url

我有一个电影角色列表，我使用axios从对后端的REST调用中获得这些角色。我为每个角色在引导卡中显示它们。我要做的是搜索giphy中的字符名，并使用giphy url作为卡的img src

当我尝试此操作并查看Vue开发工具内部时，img src显示“承诺”

此字符是{{character.role}

我尝试使用

：img src=“getGiphy（character.name）”

---

Vue无法解析属性中的承诺，因此您必须执行类似的操作

模板

<b-card
  ...
  :img-src="character.giphyImage"
  ...
>

---

Vue无法解析属性中的承诺，因此您必须执行类似的操作

模板

<b-card
  ...
  :img-src="character.giphyImage"
  ...
>

---

谢谢这是有道理的。我现在正在获取每个字符的URL。但不知何故，这些图像并没有显示出来。Vue开发工具中的imgSrc显示“null”@vince Nice！您是否使用了正确的协议

http:

？好的，那么。。。我现在去了厕所，当我回来的时候，图像显示出来了。无论出于什么原因，装载它们都要花费很长时间。我在10分钟前点击了刷新，但它们仍然没有显示。奇怪。@vince如果你陷入困境，请毫不犹豫地问另一个问题，所以社区很乐意提供帮助！谢谢这是有道理的。我现在正在获取每个字符的URL。但不知何故，这些图像并没有显示出来。Vue开发工具中的imgSrc显示“null”@vince Nice！您是否使用了正确的协议

http:

？好的，那么。。。我现在去了厕所，当我回来的时候，图像显示出来了。无论出于什么原因，装载它们都要花费很长时间。我在10分钟前点击了刷新，但它们仍然没有显示。奇怪。@vince如果你陷入困境，请毫不犹豫地问另一个问题，所以社区很乐意提供帮助！

private async created() {
  ...
  await Promise.all(this.characters.map(async character => {
    character.giphyImage = await this.getGiphy(character.name);
  }));
}