Vue 给图片src添加变量

Question

这可能是一个愚蠢的问题，但我不知道如何在 Vue 中将变量放入图像 url。这是代码：

app.component("summoner-details", {
  template: `
    <div>
    <h1>{{name}}</h1>
    <img height='100' width='100' src="{{summonericon}}" alt='icon'/>
    <p>{{level}}</p>
    <p>{{summonericon}}</p>
    </div>
    `,
  props: ["name", "level", "summonericon"],
}),
  app.mount("#app");

{{}} 和 ${} 方法不起作用。任何人都知道我会怎么做。提前致谢。

Answer 1

您可以使用 v-bind 指令。

<img height='100' width='100' v-bind:src="summonericon" alt='icon'/>

Answer 2

像这样：

<img height='100' width='100' :src="summonericon" alt='icon'/>

可能与

重复

Vue 给图片src添加变量

Vue add variable to image src

javascript

vue.js