学习vue的弯弯绕绕之v-for循环输出图片
一个正常的v-for循环应该是这样的<div id="app"><template><el-carousel indicator-position="outside"><el-carousel-item v-for="data in list">{{data.src}}</el-carousel-item></el-carous
·
一个正常的v-for循环应该是这样的
<div id="app">
<template>
<el-carousel indicator-position="outside">
<el-carousel-item v-for="data in list">
{{data.src}}
</el-carousel-item>
</el-carousel>
</template>
</div>
var oVue = new Vue({
el : '#app',
data : {
list : [
{src:'http://www.caiqi.com/upload/image/19/2017-06-07/2017060711393060.jpg' },
{src:'http://www.caiqi.com/upload/image/19/2017-06-07/2017060711393060.jpg'},
{src: '../static/images/B1.jpg'},
{src: '../static/images/B3.jpg'}
]
}
});
但是如果你要换成循环输出图片的话
<img src="{{data.src}}">
是不行的。
必须改成这样:
<img v-bind:src="data.src">
更多推荐
已为社区贡献1条内容
所有评论(0)