使用 v-for 展示出陣列
呈現結果為:
原始碼如下:
<div id="app-4">
<ol>
<li v-for="todolist in todos">
{{ todolist.text }}
</li>
</ol>
</div>
【注意】這裡的todolist可以換成任何詞。
var app4 = new Vue({
el: '#app-4',
data: {
todos: [
{ text: 'Learn JavaScript' },
{ text: 'Learn Vue' },
{ text: 'Build something awesome' }
]
}
})