vue 自學筆記(5) 列表渲染

列表渲染

　　　　一:v-for 指令

　　　　當咱們涉及到列表渲染數據的時候，不可能作一個重複的工做去不停的一個一個的渲染每一項列表。而且列表數據的表現，好比從後端請求過來的數據，不多是一個一個的單獨的 JSON 數據，一般會是一個數組或者對象。

　　　　針對這樣的情景，Vue 提供了 v-for 指令使列表使咱們能夠根據一組數組的選項列表進行渲染。而且，咱們只須要寫一個列表元素做爲模板就能夠經過遍歷屬性的方式渲染出大量的列表內容。

　　　　

　　　　　　固然，除了列表，也能夠經過v-for重複渲染其餘元素，這裏咱們使用v-for重複渲染 div，v-for="(item, index) of list"是一個固定的語法，參數第一項爲遍歷 list 屬性的每一項，參數第二項爲遍歷 list 時的索引。

　　　　除了item of items這種寫法，使用item in items也是能夠的。(items 是源數據數組而且 item 是數組元素迭代的別名)。

　　　

　　　

 

　　注意:!!

　　　　　　

 

 　　　　　　二:對vue 數組數據的修改

　　　　如今頁面有 5 個數據，咱們在控制檯 vm.list[5] = '123'，添加一條數據，發現 vm.list 雖然多了一條數據，但頁面沒有響應式的變化