1. 程式人生 > >Vue用v-for給src屬性賦值

Vue用v-for給src屬性賦值

我的程式碼結構如下面程式碼所示,無法執行,在img中的src屬性中無法用mustache表示法

<div id="test">
    <div v-for="item in lists">
        <img src="{{item.img}}">
    </div>
</div>
new Vue({
    el: "#test",
    data: function () {
        return {
            lists: [
                { img : 'img1' },
                { img 
: 'img2'
}, { img : 'img3' }, { img : 'img4' } ] } }, })

後來我將html中的程式碼改成如下

<div id="test">
    <div v-for="item in lists">
        <img v-bind:src="item.img">
    </div>
</div>

使用v-bind標籤後,就可以正常使用了