Vue用v-bind给标签属性赋值 src, href...

给属性渲染数据不能使用 {{name}} 标记, 请使用 v-bind:属性名称=”name”
name是json数据键值对中的键名, 请配合下面JS代码片食用

HTML

<div id="sidebar">
    <ul>
        <li v-for="list in lists" v-bind:class="class">
            <img v-bind:src="list.src"  />
        </li>
    </ul>
</div>

JS

var app = new Vue({
    el: '#sidebar>ul',
    data:{
    "lists":[
        { src:"icon.png" },
        { src:"icon.png" },
        { src:"icon.png" },
    ],
    class:"active",
    name:"剑齿虎"
    }
});
posted @ 2017-08-31 23:31  余晓波  阅读(5520)  评论(0编辑  收藏  举报