如何在vue.js中使用img src？

Question

我有这个在我的vue.js模板：

<img src="/media/avatars/{{joke.avatar}}" alt=""> 

这是一个循环，使笑话里面。 Otehr领域呈现不错，但对于像我在控制台收到此错误：

• SRC =“/媒体/化身/ {{joke.avatar}}”：里面的属性插值已被删除。改为使用v-bind或冒号简写 。例如，而不是使用。

我也用v-bind:src="...，但得到invalid expression错误。

我该如何解决这个问题？

Answer 1

试试这个：

<img v-bind:src="'/media/avatars/' + joke.avatar" /> 

不要忘记在你的路径字符串单引号。 也在你的数据检查你有正确定义的图像变量。

joke: { 
    avatar: 'image.jpg' 
} 

的工作演示在这里：http://jsbin.com/pivecunode/1/edit?html,js,output