這次帶給大家如何用v-for給src屬性賦值,用v-for給src屬性賦值的注意事項有哪些,下面就是實戰案例,一起來看一下。
我的程式碼結構如下面程式碼所示,無法執行,在img中的src屬性中無法用mustache表示法
<p id="test"> <p v-for="item in lists"> <img src="{{item.img}}"> </p> </p>
new Vue({ el: "#test", data: function () { return { lists: [ { img : 'img1' }, { img : 'img2' }, { img : 'img3' }, { img : 'img4' } ] } }, })
後來我將html中的程式碼改成如下
<p id="test"> <p v-for="item in lists"> <img v-bind:src="item.img"> </p> </p>
使用v-bind標籤後,就可以正常使用了
相信看了本文案例你已經掌握了方法,更多精彩請關注php中文網其它相關文章!
推薦閱讀:
#以上是如何用v-for給src屬性賦值的詳細內容。更多資訊請關注PHP中文網其他相關文章!